计算状态和常规状态之间的区别？

Question

有人告诉我，我在 React 项目中使用了太多状态，我应该使用计算状态而不是常规状态，但我无法理解计算状态到底是什么、如何使用它以及何时适合使用它以及它与常规状态有何不同？

我尝试在谷歌上查找资源，但我仍然无法真正掌握它。任何指导或示例将不胜感激。

Answer 1

计算状态是指从状态或道具派生的值。计算状态是反应性的，就像正常状态一样。

计算状态的优点是您不需要手动管理派生状态，react 会为您处理。

我从 React docs 中摘录了这个示例来展示它的示例。

  const [firstName, setFirstName] = useState('Taylor');
  const [lastName, setLastName] = useState('Swift');
  // ✅ Good: calculated during rendering
  const fullName = firstName + ' ' + lastName;
  // ...
}