react hooks set multiple states at once

在 React 中，如果我们需要同时更新多个状态，我们可以使用 useState 钩子提供的数组解构语法来实现。

假设我们有两个状态变量 count 和 message ，我们可以这样定义它们：

const [count, setCount] = useState(0);
const [message, setMessage] = useState('');
现在，如果我们想同时更新这两个状态，我们可以使用 setCount 和 setMessage 方法来更新它们。但是，这样会导致 React 执行两次更新操作，这可能会影响性能。
为了避免这种情况，我们可以使用 useState 提供的函数式更新方式来一次性更新多个状态。下面是一个示例：
const [state, setState] = useState({
  count: 0,
  message: ''
const handleButtonClick = () => {
  setState(prevState => ({
    ...prevState,
    count: prevState.count + 1,
    message: 'Hello World!'
  }));
在上面的代码中，我们使用了一个名为 state 的对象来存储两个状态变量。然后，在更新状态时，我们使用了一个回调函数来获取当前状态的副本，并将新的状态值合并到副本中。最后，我们使用 setState 方法将新的状态值应用到组件中。
通过使用这种方式，我们可以同时更新多个状态，同时只执行一次更新操作，从而提高 React 应用的性能和响应速度。