• 函数式组件
• 类组件

1 . 函数式组件

• 一般用于静态界面

function Childom( props ){
   //  props 打印结果就是{tianqi:'天气'}
   let   title=<h2>我是副标题</h2>
    let  tianqi=props.tianqi
    let  isGo=tianqi=="下雨"？"不出门" :"出门"
   return (
      <div>
         <h1>这是一个函数组件</h1>
         {title}
          <div>
              是否出门 {isGo}
          </div>
      </div>
   )
}
// 在这可以传参，
ReactDOM.render(<Childom   tianqi="下雨"/>,document.getElementById('root'))

2 . 类组件

• 一般有交互的组件,有数据的操作

class HellowWorld extends React.Component{
  render(){
          console.log(this)
        // { props:'下雨'}
     return(
        <div>
          <h1>这是一个类组件</h1>
        </div>
   )
 }
}
ReactDOM.render(<HellowWorld   tianqi="下雨" />,document.getElementById('root'))

3 . 复合组件--组件中又有组件