reactjs - 是否可以仅在道具更改时运行 useEffect 而不是状态更改?
问题描述
正如标题所示,我试图让 useEffect 仅在道具更改时运行,而不是在我更改状态时运行(或者特别是在我运行 useState 时它不应该运行)。
这样做的原因是我有用户输入,默认为存储在数据库中的输入,但在挂载时获取,但如果道具更改,则可以更改。
useEffect(() => {
let userTags = [];
props.question.tagVotes.forEach((tagVote) => {
if (_.includes(tagVote.users, props.user.username)) {
userTags.push(tagVote.tag);
}
});
setChosenTags(userTags);
});
是否可以?谢谢。
解决方案
useEffect
每次作为第二个参数给出的数组中的任何元素发生变化时,作为第一个参数给出的函数都会运行,因此您可以将道具放入此数组中,以使其在任何道具发生变化时再次运行。
例子
function App(props) {
useEffect(() => {
let userTags = [];
props.question.tagVotes.forEach(tagVote => {
if (_.includes(tagVote.users, props.user.username)) {
userTags.push(tagVote.tag);
}
});
setChosenTags(userTags);
}, [props.question]);
// ...
}
推荐阅读
- mysql - 仅针对 Mysql 中的 1 列进行实时搜索 - 无需任何插件
- java - 爪哇。groupingBy throw to classes
- c++ - C++ 指针不为空但不能被释放
- javascript - 尝试为各种任务创建 javascript 输出循环
- c - 使用未声明的标识符“cardNum”
- javascript - 构建 React 应用程序时 SCSS 加载错误
- html - 如何使这个 CSS 动画流畅?
- javascript - Mailchimp 在一页上嵌入两个表单
- c++ - 你好,其实我是想看懂下面的代码。有人可以详细说明代码到底在做什么。为什么它在第 31 行崩溃
- java - 如何准确知道 NullPointerException 来自何处?