函数组件

// 创建函数式组件
function Person (props) {
  console.log(props);
  let { name, age, sex } = props;   // 解构赋值
  return (
    

      
姓名: {name}
      
性别: {sex}
      
年龄: {age}
    
  )
}

// 渲染组件到页面
ReactDOM.render(, getElementById('test'))

小结

1. 函数式组件的函数参数为props
2. 函数式组件没有实例，没有this
3. 函数式组件没有state，如果函数式组件需要使用state，需要使用useState Hooks
4. 函数式组件没有生命周期函数，如果函数式组件需要使用生命周期钩子，需要使用useEffect
5. 函数式组件没有render方法，函数式组件的return返回jsx的结构，相当于class组件的render方法