Question

我正在使用React和Bacon.js构建应用程序。

我有一个像这样的学生名单：

var students = [
   {"name": "student1"}
   ...
];

然后我使用Bacon.bus构建一个EventStream。

var studentStream = new Bacon.Bus();
students.forEach(studentStream.push.bind(studentStream));

我想要做的是每当我将新数据推送到总线时，我想用新数据更新我的视图。

var studentContainer = React.createClass({
    getInitialState: function () {
        return {students: []};
    },
    componentWillMount: function () {
        // 1: convert this.prop.studentStream to an array so it can be rendered
        // 2: Set state to the new array
    },
    render: function () {
        ...
    }
});

Answer 1

你离这儿很近。在您的React组件中订阅您的事件总线：

componentDidMount: function() {
    studentStream.onValue(function(val) {
        this.setSate({ students: val });
    }.bind(this));
}

无论推送到studentStream的值是什么，都会流入组件的状态。我还建立了一个小型库，用于处理React.js和Bacon.js：https://www.npmjs.org/package/fluxstream

将培根流中的所有值组合成单个阵列

1 个答案: