useState
useState
是 React 提供的一个 Hook,用于在函数组件中添加状态。它接受一个初始状态作为参数,并返回一个数组,其中第一个元素是当前状态值,第二个元素是一个更新状态的函数。
import React, { useState } from 'react';
function Counter() {
const [count, setCount] = useState(0);
return (
<div>
<p>Count: {count}</p>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
);
}
在这个例子中,我们使用 useState
来创建一个名为 count
的状态变量,并将其初始值设置为 0
。然后,我们使用 setCount
函数来更新 count
的值。当用户点击按钮时,setCount(count + 1)
将 count
的值增加 1
,并重新渲染组件。
useState
的初始状态可以是任何类型,包括对象和数组。当初始状态是一个对象或数组时,React 会使用浅比较来比较新旧状态,如果新旧状态相等,React 将不会重新渲染组件。