为什么我在 React 中的钩子变量没有保持我设置的状态？

Question

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

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

但是，每当我更改 props.employees 的值时，我的 TeamsArr 变量最初为空，然后将该值更改为当前的 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 更改时都会添加它，但不会删除旧值。