如何在 promise 中设置 react hook 的值?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在 promise 中设置 react hook 的值?相关的知识,希望对你有一定的参考价值。
我从承诺中获取了一个数据,我想把它设置在react hook中,它确实是这样做了,但它会产生无限的请求,并重新渲染页面,我还想让一些特定的唯一数据来填充。
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
钩。这是这个钩子的第二个论点。
useEffect(() => {
// your code
}, [deps]);
deps解释。
- 无值:每次组件渲染时都会执行效果。
- []:只在组件第一次渲染时执行效果。
- value1, value2, ...]: 如果任何值发生变化,将执行效果。
如需进一步阅读,我强烈推荐 本博文.
另一答案
移动 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]);
以上是关于如何在 promise 中设置 react hook 的值?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 PromiseKit 中设置 when(fulfilled:)?
React setState 未能捕获被拒绝的 Promise