无法在回调内调用 useSelector

Bar*_*man 4 reactjs react-redux react-hooks redux-toolkit

我对 redux / 工具包很陌生。

我需要在我的 React 功能组件中使用 redux 钩子来获取数据useSelector,但是数据没有很快准备好,所以看起来useSelector首先会返回一个空数组,然后当数据准备好时,它将返回填充的数据数组。

起初,我认为 useSelector 可以是异步的,但事实并非如此。每当我正在寻找的数据的值发生变化并且这不适合我的功能需求时,Redux 都会重新渲染我的组件。在某些情况下,我不希望我的组件重新渲染(特别是当只有数据的原子部分发生变化时,奇怪的是也会重新渲染我的所有组件)。

我首先尝试的是将我的数据作为组件状态的一部分,这样我就可以决定何时更新它,我在useSelector内部调用useState它接受回调

const [data, setData] = useState(()=> useSelector(...))
Run Code Online (Sandbox Code Playgroud)

但我收到错误:

无法在回调内调用 useSelector

有什么建议 ?

小智 9

您可以使用useEffect

const selectorData = useSelector(...);
const [data, setData] = useState(selectorData);

useEffect(() => {
  setData(selectorData)
}, [selectorData])
Run Code Online (Sandbox Code Playgroud)

如果你这样做,组件不会每次都重新渲染,它只会在选择器数据到来时重新渲染。