如何在promise中设置react hook的值？答案

【问题标题】：How to set value of react hook in promise?如何在promise中设置react hook的值？
【发布时间】：2020-08-05 16:52:13
【问题描述】：

我从 Promise 中获取数据，我想将其设置在 react 钩子中，它确实可以，但它会发出无限请求并重新呈现页面，我还想要一些特定的数据来填充

const [rows, setRows] = useState([]);
useEffect(() => {
    async function fetchData() {
        myEmploiList({
            user: user.id
        }).then((data) => {
            //setRows(data);
            const newData = [];
            data.forEach((item, index) => {
                newData[index] = {
                    id: item._id,
                    name: item.name,
                    society: item.society
                };
                setRows(newData);
            });
        });
    }
    fetchData();
});

【问题讨论】：

您阅读过useEffect 的文档吗？如果你不提供 deps 数组，它会被调用 every render.
myEmploiList 和 user 来自哪里？
myEmploiList 是一个请求，用户来自当前用户的 redux 商店...我永远不会猜 deps 实际上我是新手，很抱歉。

标签： javascript reactjs promise request react-hooks

【解决方案1】：

您应该将依赖项添加到您的 useEffect 挂钩。这是这个钩子的第二个参数。

useEffect(() => {
// your code
}, [deps]);

部门解释：

无值：每次渲染组件时都会执行效果。
[]：只会在组件第一次渲染时执行效果。
[value1, value2, ...]：如果有任何值变化，将执行效果。

为了进一步阅读，我强烈推荐this blog post。

【讨论】：

【解决方案2】：

将setRows 调用移出forEach 循环并将user.id 包含到依赖数组中

const [rows, setRows] = useState([]);
useEffect(() => {
    async function fetchData() {
        myEmploiList({
            user: user.id
        }).then((data) => {
            //setRows(data);
            const newData = [];
            data.forEach((item, index) => {
                newData[index] = {
                    id: item._id,
                    name: item.name,
                    society: item.society
                };
            });
            setRows(newData);
        });
    }
    fetchData();
}, [user.id]);

【讨论】：