React-backbone" griddle"渲染问题

时间:2015-05-29 12:27:15

标签: javascript backbone.js datagrid reactjs

尝试使用绑定到主干集合的数据呈现反应数据网格组件。但是当我使用通常的全局数组时它可以正常工作。当我尝试发送到"平板电脑"它从国家收集空格。

更简单地说,我将问题放在代码的评论中:

var fakeData =  [  // Usual global array of objects for test and example
  {
    "id": 2,
    "name": "Mayer Leonard",
  },
    {
    "id": 1,
    "name": "Ivvy Leonard",
  }
];

var MyComponent = React.createClass({displayName: "MyComponent",

    // Use mixin to bind react class and backbone collection
    mixins: [backboneMixin], 
    // Next function testing of mixin's working. It's correct.
    createEntry: function (entry) {
        return React.createElement("div", {key: entry.id}, entry.id, " + ", entry.name);
    },

    fetch_btn: function() {
        this.props.collection.add({id:4, name: "Hello 4"});
    },
    getList: function(){
        var ar = this.state.collection;
        _l("ar = ", ar);
        return ar;
    },
    // Now the issue becoming
    render: function () {
        return (
            React.createElement("div", null,
                /* next code works fine, so the collection is valid,
                 also the collection have the same keys as fakeData */
                this.state.collection.map(this.createEntry), 
                React.createElement("input", {type: "button", value: "Fetch", onClick: this.fetch_btn}),
                /* next two rows are console.log wrappers and they show
                 that arrays are OK and similar */
                _l("react list",this.state.collection),
                _l("fake", fakeData),
                /* In this variant next code draws properly grid, but
                 if I change to {results: this.state.collection}
                 drawing function breaks and shows empty grid */
                React.createElement(Griddle, {results : fakeData})
            )
        );
    }
});

所以,如果有人帮忙,我会很感激。

0 个答案:

没有答案