将新数据添加到react.js中的状态

时间:2015-09-13 15:44:52

标签: reactjs

我正在开发一个项目,我正在使用react.js和laravel我正在使用的反应在帖子中添加新评论我试图反应的状态但是我想在我的服务器中添加从服务器中检索到的新数据状态,不删除或删除该州的旧数据。我如何实现该方法,是否有任何依赖,或任何示例或教程?即使我采取了错误的方法,也请告诉我什么方法将是完美的。

我的问题的示例代码 - 我有一个最初获取数据的ajax函数。

getData: function() {
    $.ajax({
        url:        '/get-data',
        dataType:   'json',
        cache:      false,
        success:    function(data) {
            this.setState({
                data: data 
            });
        }.bind(this)
    });
}

现在在触发新事件后,我想更新我的状态,而不会丢失旧数据。

谢谢。

2 个答案:

答案 0 :(得分:0)

您应该使用react immutability helpers

这允许您更新状态的嵌套部分,而无需重置整个事物。如果您只是操纵状态的根级属性(例如this.state.blahthis.state.foo),则this.setState({ foo: 'a value'});将保留其他根元素。

如果你想完全重置状态,可以使用replaceState({});

setState

replaceState

答案 1 :(得分:0)

如果代码中的data是有效的JSON对象,则可以使用以下内容:

在将数据设置为state.data之前合并数据。使用lodash.merge的示例:

import merge from 'lodash.merge'

// some of your code

// inside your getData function in your components
$.ajax({
    success: function (data) {
        this.setState({
            data: merge({}, this.state.data, data)
        });
    }.bind(this)
});

虽然做这种有益健康的替代品可能不是一个好习惯,但它应该解决您的问题。什么是更好的方法并不是这个答案的范围:D