Reactjs 如何在react钩子中实现派生状态

在本例中，我使用useffect钩子来更新派生状态，以响应props中的更改。在某些情况下，这可能是解析派生状态的常见解决方案。或者如果在这种情况下有任何问题？

一般来说，您的实现没有问题，因为isScrollingDown只是对row props值的更改做出反应

然而，我确实觉得没有必要在场景中使用派生状态，因为逻辑相当简单

消除维护组件状态的需要，并消除任何其他不必要的重新渲染源，这将更加直观

function ScrollView(props) {
  const [isScrollingDown, setIsScrollingDown] = useState(false);

  useEffect(() => {
    setIsScrollingDown(props.row)
  }, [props.row])

  // this is a fake function to show its own logic to change the state,
  // and this function could be called in somewhere to make the isScrollingDown
  // state to be a derived state
  const handleClick = () => {
    setIsScrollingDown(false)
  }

  return `Scrolling down: ${isScrollingDown}`;
}

编辑：考虑到实际上需要一个内部状态，我建议的一些其他优化是在useEffect钩子中执行检查，以便仅在道具和状态值不同时更新状态：

function ScrollView({ row }) {
  return `Scrolling down: ${row}`;
}

---

如果它是派生状态，那么为什么需要一个新的有状态变量呢？为什么不直接说const isScrollingDown=props.row？因为在ScrollView组件中，它有自己的逻辑来更新isScrollingDown状态，我没有粘贴代码，只是显示有关其props更改的代码。所以在这种情况下，这是一种常见的解决方案吗？因为在ScrollView组件中，它有自己的逻辑来更新isScrollingDown状态，我没有粘贴代码，只是显示有关其道具更改的代码。因此，在这种情况下，这是一个常见的解决方案吗？啊，我明白了。。由于还有其他内部逻辑需要您更新状态，我想您应该维护状态。在这种情况下，是的，利用useEffect实现这一目的是一个有效的解决方案！非常感谢你。但是，如果这是一个通用的解决方案，那么以这种方式实现getderivedstatefromprops有意义吗？是的，该链接中的提示也很有用。你应该考虑那些写在那里的东西。

useEffect(() => { 
  if (props.row === isScrollingDown {
    return;
  }
  setIsScrollingDown(props.row);
}, [props.row]);