使用class关键字创建组件
目录
一、最基本的组件结构
二、用class关键字创建组件
三、两种创建组件方式的对比
一、最基本的组件结构
基于class关键字创建组件
//如果要使用class定义组件,必须让自己的组件,继承自React.component
class 组件名称extends React.component{
//在组件内部,必须有render函数,作用:渲染当前组件对应的虚拟DOM结构
render(){
//render函数中,必须返回合法的JSX虚拟DOM结构
return<div>这是class创建的组件</div>
二、用class关键字创建组件
//class关键字创建组件
class Movie extends React.Component{
//render函数的作用,是渲染当前组件所对应的虚拟DOM元素
render(){
//return null
return<div>
这是Movie组件
</d
const user = {
name:’zs’
age:’22’
gender:’男’
}
reactDOM.render(<div>
123
{/*<Hello name=(user,name) age=(user,age)></Hello> */}
{/* <Hello {…user}></Hello> */}
</div>,document.getElementById(‘app’))
三、两种创建组件方式的对比
1.用构造函数创建出来的组件,叫做“无状态组件”
2.用class关键字创建出来的组件,叫做“有状态组件”
3.什么情况下使用有状态组件?什么情况写使用无状态组件?
//有状态组件和无状态组件之间的本质区别就是:有无sate属性