用于在函数组件中添加状态管理功能。它允许你在函数组件内声明状态变量并提供更新这些状态的函数。useState 提供了一种简洁的方式来跟踪组件的状态和响应用户交互。
基本状态管理:当组件需要保存和管理一些状态(如用户输入、加载状态、计数器等)时,可以使用 useState。
表单输入:用于管理表单字段的状态,例如处理用户输入的数据。
条件渲染:根据状态值的变化控制组件的渲染逻辑或展示不同的内容。
组件间通信:在组件内部处理和更新状态,以便在组件的不同部分使用和响应这些状态。
const [state, setState] = useState(initialState)
initialState: useState 的参数是状态的初始值。可以是任何类型的值,如数字、字符串、对象或函数(如果需要根据其他值计算初始状态)。
异步更新:状态更新可能是异步的。当调用 setState 更新状态时,React 会调度重新渲染,但更新并不一定立即生效。因此,依赖于最新状态值的操作应使用函数式更新:
setCount(prevCount => prevCount + 1);
函数式初始化:如果初始状态的计算比较昂贵,应该将初始状态设置为一个函数。这样,该函数只会在初次渲染时执行一次:
const [value, setValue] = useState(() => computeInitialValue());