useState语法讲解
 
语法定义
 
const [state, dispatch] = useState(initData)
 
- state:定义的数据源,可视作一个函数组件内部的变量,但只在首次渲染被创造。
 - dispatch:改变state的函数,推动函数渲染的渲染函数。dispatch有两种情况-非函数和函数。
 - initData:state的初始值,initData有两种情况-非函数和函数。
 
 
案例演示
 
- 变量定义
 
 
const [count, setCount] = useState('河畔一角');
setCount('zhangsan')
 
- 对象定义
 
 
const [user, setUser] = useState({ name: '河畔一角', age: 30 });
setUser({...user, age:20})
 
- 数组定义
 
 
const [list, setList] = useState(['Tom', 'Jack']);
setList([...list, 'zhangsan'])
 
- 异步执行
 
 
const [count, setCount] = useState(0);
setCount(count + 1)
setCount(count + 1)
setCount(count + 1)
setTimeout(()=>{setCount(count + 1)
})
 
- 函数执行
 
 
const [count, setCount] = useState(0);
setCount(count => count + 1)