如何将 React 本地状态存储到 Redux 全局存储（HOOKS）

Question

const initReactiveProperties = (user: any) => {
    //TODO: change 'any' to customized interface
    user.connected = true;
    user.messages = [];
    user.hasNewMessages = false;
    setConnectedUsersList((prevUsers: any) => [...prevUsers, user]); //setting the connected users in state
  };

  // storing connected users
  const setConnectedUsers = () => {
    socket.on("users", (users) => {
      users.forEach((user: any) => {
        user.self = user.userID === socket.id; // if the user is the authenticated user
        initReactiveProperties(user);
      });
      users = users.sort((a: any, b: any) => {
        if (a.self) return -1;
        if (b.self) return 1;
        if (a.username < b.username) return -1;
        return a.username > b.username ? 1 : 0;
      });
    });
  };

  // after new user connects, store it in an array
  const storeNewUser = () => {
    socket.on("user connected", (user) => {
      initReactiveProperties(user);
      // dispatch({ type: CONNECTED_USERS, payload: connectedUsersList });
    });
  };

  useEffect(() => {
    setConnectedUsers();
    storeNewUser();
    dispatch({ type: CONNECTED_USERS, payload: connectedUsersList });
  }, []);

connectedUsersList 获取所有当前连接的用户，我想更新我的 redux 全局存储中的 usersList，但它不会立即作为 connectedUsersList 以 redux 状态存储。但事实并非如此。

Answer 1

如果你想在 redux 用新的 connectedUsersList 更新后做一些事情，你可以使用 useEffect。

const usersListFromRedux = useSelector(state => state.usersReducer.usersList)

useEffect(() => {
  ...do something
}, [usersListFromRedux]);