Question

添加新对象并获取具有更新数据的newTodos。在渲染函数中，我得到this.props.todoList，这是一个要显示的对象数组。

如何使用newTodos更新todoList以显示此新数据？

我可以使用setState({todoList: newTodos})和渲染函数get this.state.todoList等来执行此操作，但我不希望在状态中保留大对象（将来）。相反，我想使用道具。

有任何建议吗？

var React = require('react');

var TodoList = require('./todo-list.js');

var App = React.createClass({
    getInitialState: function () {
        return { filter: 'active' };
    },
    onAdd: function (txt, color) {
        console.log('txt: ' + txt + ', color: ' + color);
        var newTodos = this.props.todoList.push(Map({ txt: txt, isCompleted: false, color: color }));

        this.forceUpdate();
        // this.setState(this.state);
    },
    render: function () {
        var { todoList } = this.props;
        return (
            <div>
               <TodoList todoList={todoList}/>
            </div>
        );
    }
});


module.exports = App;

Answer 1

Pract中唯一的目的是将数据从父组件传输到子组件，以便通知它们状态已发生变化。
您必须维护状态，因为它是控制应用程序的正确反应方式组件和维护状态完整性。
不确定为什么你更喜欢道具而不是你必须在任何地方存储数据，但是使用forceUpdate（）提供的解决方案很快会使你的app状态不一致只要你和＃39;将添加越来越多的组件。

React.js：在add上重新渲染组件数据

1 个答案: