useState() 这个钩子的功能:就是让静态组件,可以拥有状态state刷新的功能,类似于class中this.state this.setState(),都是成对出现 let [state状态变量,修改状态的函数]=useState(初始state值);
实现一个计数器--一个状态管理:
import React from 'react'
import {useState} from 'react'
const App = ()=>{
const [count,setCount]=useState(0);
return (
<div>
<p>计数器</p>
<p>{count}</p>
<button onClick={()=>setCount(count+1)}>+</button>
</div>
)
}
export default App;
实现一个计数器及名称改变--多个状态管理:
import React from 'react'
import {useState} from 'react'
const App = ()=>{
const [count,setCount]=useState(0);
const [name,setName]=useState("tom");
return (
<div>
<p>名称</p>
<p>{name}</p>
<button onClick={()=>setName("jarry")}>点击改变name</button>
<hr/>
<p>计数器</p>
<p>{count}</p>
<button onClick={()=>setCount(count+1)}>+</button>
</div>
)
}
export default App;