时间戳

首页 > 解决方案 > 读取状态数组 ReactJS

javascript - 读取状态数组 ReactJS

问题描述

我有 2 个文件 Server.js 和 Servicedesk.js，我使用 socket.io 和 ReactJS。我想将来自 Server.js（我的 socket.io 文件）的数组与来自 Servicedesk.js 的数组进行比较。在 Servicedesk.js 我有以下代码：

class Servicedesk extends React.Component {
    constructor(props) {
        super(props);    

    this.state = {
       messages: [],
    };

    socket.on('updateRooms', function(combMessages) {
            console.log(combMessages.length);
            console.log(this.state.messages.length);

            let intersection = combMessages.filter(x => this.state.messages.includes(x));
            console.log(intersection);
    });
  }
}

在 Server.js 中：

let combMessages = [];

我将 combMessages 传递给 Servicedesk.js，但我如何比较两者？因为我不能做类似的事情：

let intersection = combMessages.filter(x => this.state.messages.includes(x));

因为我收到了这个错误：

TypeError: undefined is not an object (evaluating 'this.state.messages')

标签： javascriptarraysreactjsobjectsocket.io

解决方案

在 中socket.on()，您的

 function(combMessages) { 
     console.log(combMessages.length); 
     console.log(this.state.messages.length); 
     let intersection = combMessages.filter(x => this.state.messages.includes(x)); 
     console.log(intersection);

}

看不到组件的上下文。因此，您应该使用arrow function(See the docs)，它将上下文绑定到您的函数，如下所示：

 socket.on('updateRooms',(combMessages) => {
     console.log(combMessages.length); 
     console.log(this.state.messages.length); 
     let intersection = combMessages.filter(x => this.state.messages.includes(x)); 
     console.log(intersection); 
 })

推荐阅读