React组件道具不更新

Question

Hello我创建了一个简单的React Component，其中只有一个标签可以在触发SignalR方法时更改其内容。我的反应组件就像这样：

var PersonalityStatusApp = React.createClass({

getInitialState: function () {
    return { data: dataInit };
},

componentWillMount(){
    var self = this;
     this.setState({ data:this.props.status});
        Votinghub.on("UpdateStatusLabel", function (data) {
        var obj = $.parseJSON(data);
        self.setState({ data: obj });
    });
},

render: function () {
    return (
        <div className="PersonalityStatusApp">
             <label>{this.props.status}</label>
        </div>
    );
}

}）;

当te组件收到UpdateStatusLabel signalR消息时，它会使用从signalR消息中获取的值更改组件的状态。

UpdateStatusLabel方法获取正确的值。

这会触发render方法，但是当我检查render方法中的属性时，我看到值仍然是初始状态的值。

有人能帮助我吗？

Answer 1

原因是，您正在更新状态变量并打印props值。最初state变量数据的值为this.props，在您获得signalR之后，state更新data: obj，因此打印{的值{ {1}}它将打印更新的值。

使用它：

this.stat.data.status

注意：最初您需要设置return ( <div className="PersonalityStatusApp"> <label>{this.state.data.status}</label> </div> );

的值

完整部分：

data: this.props