带有React钩子的forceUpdate

Question

是否可以用React钩子替换forceUpdate？

我的用例是组件实例之间的共享状态。本质上，每个实例只是单个全局状态的视图。对于ES6类，代码使用componentDidMount中的状态注册/注销组件，该状态对其更改调用forceUpdate，然后render方法直接查询全局状态。

我考虑将其切换为钩子。最初，useEffect似乎很适合该问题。但是后来我意识到我没有访问forceUpdate的权限。

我考虑了一种变通方法，该方法称为useState挂钩，以添加一个虚拟计数器，然后从效果挂钩中更新该计数器，但感觉就像是黑客。我还可以将所有相关的共享状态参数复制到效果挂钩中的组件状态，然后从状态中引用这些参数。但实际上，它复制了状态，没有用复制状态的行来膨胀代码，而当前我只能在render方法中直接使用这些行。

更新：这是codesandbox.io的链接，其中包含共享状态示例，该示例使用了我想在不复制状态或不使用伪造状态更新的情况下转换为钩子的类组件。

Answer 1

您可以使用另一种方法来进行forceUpdate。在这里：

来自react docs：

  

如果下一个值与上一个值相同，则useState和useReducer Hooks都将退出更新。适当地改变状态并调用setState不会导致重新渲染。   通常，您不应该在React中更改本地状态。但是，作为逃生舱口，即使状态未更改，也可以使用递增计数器强制重新渲染。

Answer 2

你可以简单地这样做

您可以简单地添加一个虚拟状态，您可以更改该状态以可靠地启动重新渲染。

const [rerender, setRerender] = useState(false);

...
setRerender(!rerender); //whenever you want to re-render

这将确保组件的重新渲染，因为组件总是在状态改变时重新渲染