时间戳

首页 > 解决方案 > 如何将 useEffect 用于没有依赖关系的 useState 变量？

reactjs - 如何将 useEffect 用于没有依赖关系的 useState 变量？

问题描述

我正在创建一个 React 表单，该表单在本地状态下存储了新产品列表，即

const [listItem, setListItem] = useState([]);

我有提交处理程序，我在其中附加新值，例如-

const handleAddProduct = (data) => {
  setListItem ([...listItem], data)
  console.log('ListItems-', listItem); // my console log doesn't update state but in react debugger tool I do see it's updated.
}

如何使用 useEffect 使其始终更新状态？PS - 数据不是本地状态，它仅限于某个块。

标签： reactjsuse-effectuse-state

解决方案

状态更新是异步的，不会立即反映。仅在下一个周期。这就是您可以签入 useEffect 的原因：

useEffect(() => {
console.log(listItem);
},[listItem]);

状态正在正确更新。

与问题无关，但是，如果您要添加到数组中，您可能想要这样做：

const handleAddProduct = (data) => {
setListItem ([...listItem, data]);
}

推荐阅读