无需重新合成即可更改状态

使用React的useState钩子函数可以实现更改状态而无需重新渲染组件。

示例代码：

import React, { useState } from 'react';

const Example = () => {
  const [count, setCount] = useState(0);

  const increment = () => setCount(count + 1);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={increment}>Click me</button>
    </div>
  );
};

在这个例子中，我们使用useState钩子函数来声明并初始化一个状态变量count，并使用setCount函数来更新它。使用setCount函数更新状态变量时，React会自动重渲染组件，并将更新后的值传递给相关的DOM元素，从而达到更改界面状态的目的。由于React采用了虚拟DOM技术，只有实际需要重绘的部分会被更新，因此不会导致过多的性能开销。