02 React 以两种形式去创建组件 类或者函数（二）

08==》创建组件以 1类的形式 或者以 2函数的形式

09==》使用组件
在src下创建components文件夹  是放组件的
CompType.js 组件   组件开头大写(重要)
CompType.js文件如下

import React from "react" //一定要导入React
// 函数类型去创建组件
export function Web1(){
    return <div>我是以函数的形式创建的组件</div>
}

// 以类的形式创建组件
export class Web2 extends  React.Component{
    render(){
        return <div>我是类组件</div>
    }
}

 

使用组件
// 导入组件 在一个文件中导入了两个组件哈
import {Web1,Web2} from "./components/CompType"

{/* 使用组件 */}
<Web1></Web1>
<Web2></Web2>

函数式组件与类组件的区别
函数式组件只负责  展示  不负责业务逻辑
类组件  负责负责的业务逻辑