useRef 与 useSelector 一起使用时会出现什么问题？

Question

虽然我可以使用 thunk 和/或全局存储来访问存储，但我不想将我的组件绑定到 Redux 存储。因为该组件将与项目内部和外部的其他商店一起使用。该组件有许多子组件，并通过上下文 API 将 props 传递给它们。

由于上下文 API 会导致子组件重新渲染，因此我们采用以下方法将数据从 redux 存储传递到上下文 API。这样，每当我需要访问 redux 存储中的数据时，我都可以使用

dataRef.current

：

export const useData = () => {
  const dataRef = React.useRef();

  useSelector((state) => {
    dataRef.current = state;
  });

  return dataRef;
};

这工作得很好，但我担心它是否会导致内存泄漏或任何其他未知问题。

Answer 1

它可能会导致事情无法在正确的时刻重新渲染 - 因为你在那个时间点离开了“让 React 重新渲染”的整个世界。 Redux 存储中的更改将不再重新渲染您的组件。

我认为你需要重新评估你为什么这样做。这种技术似乎将您的组件绑定到 Redux 存储，就像调用

useSeletor

一样。只要您的状态结构具有您期望的路径中的值，您也可以直接调用

useSelector

，而无需任何奇怪的解决方法。这适用于当时存在的任何 Redux 存储。