Hook

hook：
特殊的函数
hook作用：
钩入react的特性
useState:
函数组件添加state的hook

hook的声明：
类组件：
default export class Hook extends react.Component{
   //在这里写状态：
   constructor(){
     super();
     this.state = {
        id: "1",
        title:"标题"
     }
   };
   // 渲染
   render(){
    return(
     <div>
      <h1>{this.state.id}</h1>
      <h1>{this.state.title}</h1>
      <button onClick="{()=>{this.setState.id+1}}"></button>
     </div>
    )
   }
}
函数组件：
import React,{useState}
default export function Hook(){
    //hook钩入react特性
    const [list,setlists] = useState([
           {title:'标题1'},
           {title:'标题2'},
           {title:'标题3'}
     ])
    function Add(){
          let list = {title:'标题4'}
          setState([...setlists,list])
    }
   return (
    <div>
      <h1>{count}</h1>
      <button onClick="{Add}"></button>
    </div>
   )
}

读取State
class组件：<div>{this.state.count}</div>
function组件：<div>{count}</div>