reactjs - 试图在 useEffect 函数中映射状态，但它改变了状态

Question

我已经使用 redux-thunk 列出了用户列表，然后我 mapStateToProps 这些用户以将它们放入我的道具中。但是在那之后，当我尝试映射该 props.users.users 时，它会改变我的状态（即 props.users.users 会发生变化，即使我在该状态上使用了扩展运算符）。请帮助解决这个问题。

const [users, setUsers] = useState([]);

useEffect(() => {
    props.getUsers();
}, []);

useEffect(() => {
    let tempUsers = [...props.users.users];
    tempUsers = tempUsers.map(user => {
        user.created = new Date(parseInt(user.created) * 1000).toString()
        user.action = { ...user };
        return user;
    });
    setUsers(tempUsers);
}, [props.users.users]);

标签： reactjsreact-redux

Answer 1

您仍在map. 您正在直接设置user仍然引用原始用户对象的对象的属性。你也应该创建一个新的user对象副本来设置它的属性。

tempUsers = tempUsers.map(usr => {
   let user = { ...usr };
   user.created = new Date(parseInt(user.created) * 1000).toString()
   user.action = { ...user };
   return user;
});