if (currentMessage !== "") {
      const messageData = {
        room: room,
        author: username,
        message: currentMessage,
        time:
          new Date(Date.now()).getHours() +
          ":" +
          new Date(Date.now()).getMinutes(),
      };

      await socket.emit("send_message", messageData);
      setMessageList((list) => [...list, messageData]);
      setCurrentMessage("");
    }
  };

  useEffect(() => {
    socket.on("receive_message", (data) => {
      setMessageList((list) => [...list, data]);
    });
  }, [socket]);

在输出中,我在接收方两次接收到一条消息.

推荐答案

我在React中启用了严格模式

Reactjs相关问答推荐

在Reaction+Redux+RTKQuery中对API调用进行排序

使用Reaction钩子窗体验证可选字段

REACTJS:在Reaction中根据路由路径更改加载器API URL

更改滑块标记的文本 colored颜色 ./Reaction/MUI 5

子路径上未定义useMatches句柄

如何使用useState响应快速/顺序状态更新

Github 操作失败:发布 NPM 包

useEffect 和 ReactStrictMode

MERN,将动态列表中的元素插入数组

React Wordpress Apache 在索引之外重新加载 -> 未找到页面

如何渲染子路径并触发react 路由父加载器?

如何测试使用 React.createportal 呈现的组件?

带有 webpack 错误多个文件匹配路由名称的 Expo-router.无法Bundle 或部署应用程序

添加新行时自动打开可扩展表格(Antd 表格,ReactJS)

页面加载时不显示数组中的数据

当用户输入相同信息时如何禁用更新

如何使用react 路由将 url 参数限制为一组特定的值?

为什么重新渲染不会影响 setTimeout 的计数?

Axios 删除在带有授权令牌的react js 中不起作用

如何从另一个切片中的不同切片获取状态并对其进行处理?