错误而在阵列替换字符串反应状态

Question

我有以下作用的代码，它工作正常时可变日志是字符串，即注释的代码，但只要我跟阵列代替原木我正在错误，

import React from "react"; 
export default class WelcomeComponent extends React.Component { 
constructor(props) { 
    super(props); 
    this.state = { 
     // logs :'' 
     logs: [] 
    }; 
} 
componentDidMount() { 
    var socket = io('http://localhost:11001'); 
    socket.on('news', (data) => { 
     data = JSON.parse(data); 
     this.setState({ 
      logs: this.state.logs.push(data) 
      // logs: data + this.state.logs 
     }); 
    }); 
} 
render() { 
    return (<div> {this.state.logs}</div>); 
} 
} 

原木作为阵列它提供了下面的错误，

遗漏的类型错误：_this2.state.logs.push不是一个函数（...）

任何人都可以请帮助。

Answer 1

尝试使用不变性方法：

socket.on('news', (data) => { 
     data = JSON.parse(data); 
     const newLogs = [...this.state.logs, data] 
     this.setState({ 
      logs: newLogs 
      // logs: data + this.state.logs 
     }); 
    }); 

Answer 2

您直接突变的成分，这是一个很大都能跟得上的状态。尝试React Immutability Helpers

import React from "react"; 
import update from 'react-addons-update'; 

export default class WelcomeComponent extends React.Component { 
constructor(props) { 
    super(props); 
    this.state = { 
     // logs :'' 
     logs: [] 
    }; 
} 
componentDidMount() { 
    var socket = io('http://localhost:11001'); 
    socket.on('news', (data) => { 
     data = JSON.parse(data); 
     this.setState({ 
      logs: update(this.state.logs, {$push: [data]}); 
     }); 
    }); 
} 
render() { 
    return (<div> {this.state.logs}</div>); 
} 
}