javascript - 为什么 React 中的钩子(Hook)变量没有保持我设置的状态？

Question

我正在使用 React 和 Redux。当我的 props.employees 第一次更改时，useEffect 运行并将 teamArr 更新为 props.employees 的值。

但我的愿望是将 props.employees 数组添加到 teamArr 数组中，该数组应该已经填充了之前的 props.employees 数组值。

但是，每当我更改 props.employees 的值时，我的 teamArr 变量最初为空，然后将该值更改为当前的 props.employees 值。

我一直在努力弄清楚如何解决这个问题，因此非常欢迎任何帮助。

const Employees = (props) => {
    const [teamsArr, setTeamsArr] = useState([])


    useEffect(() => {
        const updatedTeamsArr = [...teamsArr, props.employees]
        setTeamsArr(updatedTeamsArr)
        }
    ,[props.employees])

Answer 1

您可以利用将函数传递给 setTeamsArr

useEffect(() => {
    setTeamsArr(prev => [...prev, ...props.employees])
    }
,[props.employees])

但在这种情况下，每次 prop.employees 更改时都会添加它，但旧值不会被删除。