javascript - 当特定 props 元素发生更新时，React Hooks 会更新状态元素

Question

通常不使用钩子(Hook)，我使用 componentWillReceiveProps，但是使用钩子(Hook)我无法使用它们。

如何在更新 prop 时更新状态元素，而不进入无限循环。

我正在尝试类似的事情，但我正在无限循环中进行。

我需要在数据表或页面等更改状态时更新数据表，然后在状态更改且与传递的原始数据不同时仅更新特定项目。

我考虑过这样做，但我不太喜欢它作为解决方案。

    if(datatable !== state.datatable)
    setState({ ...state, datatable });

你能给我一些建议吗？

function Datatable({ header, datatable = [], page = 1, perPage = 5, style }) {
    const [state, setState] = useState({
        datatable,
        page: page - 1,
        perPage,
        numberOfPages: Math.ceil(datatable.length / perPage),
    });

useEffect(() => {
        setState({ ...state, datatable });
 });
 ....
}

Answer 1

您需要将 datatable 作为依赖项传递给 useEffect Hook ，

useEffect(() => {
        setState({ ...state, datatable });
},[datatable]);

现在，仅当 datatable 更改时，您的钩子(Hook)才会执行。