如何使用 useEffect 和 useState 修复此最大深度超出错误？

Question

我有从 redux 中提取的事件，如果 events 数组包含数据，那么 updateData 将用于将事件过滤到状态变量 data.

我已将 data 和 events 作为 talked about here. 添加到依赖项数组，但我仍然收到此错误：

const SingleTable = () => {
    const events = useSelector(state => eventsSelector(state));
    const [data, updateData] = useState([]);
    const [sortCol, updateSortCol] = useState(0);
    const [sortDir, updateSortDir] = useState('ascending');

    useEffect(() => {
        const formattedArray = events ? formatLoss(events): [];

        events && updateData(formattedArray);
    }, [data, events]);

    //...

想法、想法？

Answer 1

因为每当数据更改时您都在执行 useEffect 回调，并且您在 useEffect 回调中更改数据。

删除数据作为依赖项。

使用此代码修复它

const SingleTable = () => {
const events = useSelector(state => eventsSelector(state));
const [data, updateData] = useState([]);
const [sortCol, updateSortCol] = useState(0);
const [sortDir, updateSortDir] = useState('ascending');

useEffect(() => {
    const formattedArray = events ? formatLoss(events): [];

    events && updateData(formattedArray);
}, [events]);

//...

如何使用 useEffect 和 useState 修复此最大深度超出错误？

How to fix this Maximum depth exceeded error with useEffect and useState?

javascript

reactjs

react-hooks

use-effect

use-state