1. State Hook: React.useState()
2. Effect Hook: React.useEffect()
3. Ref Hook: React.useRef()
const [num, setnum] = React.useState(0)
const Refinput = React.useRef()
//模拟生命周期
React.useEffect(() => {
let Atime = setInterval(() => {
setnum(num => num + 1)
}, 1000)
return () => {
clearInterval(Atime)
}
}, [])
const add = () => {
setnum((num) => {
return num + 1
})
}
//使用ref展示input value内容
const Msgvalue= () => {
console.log(Refinput.current.value);
}
return (
<div>
<input type="text" ref={Refinput} />
<div>{num}</div>
<button onClick={add}>+1</button>
<button onClick={Msgvalue}>点我提示</button>
</div>)