Object.mapObjectToArray不是函数

时间:2016-04-23 12:18:03

标签: javascript reactjs jsx

我的代码存在很大问题,因为我没有得到映射对象的错误。我仍然收到消息'object.mapobjecttoarray不是函数''

var AppNo = React.createClass({
render: function() {
    var dataNodes = Object.mapObjectToArray(this.props.data, function(no, id) {
        return (
            <div key={id}>{no.name}</div>
        )
    });
    return (
        <div>
            {dataNodes}
        </div>
    );
}
});
var App = React.createClass({
getInitialState: function() {
    return {
        data: {
            no: {
                name: 'text 1'
            },
            non: {
                name: 'text 2'
            }
        }
    }
},
render: function() {
    return (
        <div className="container-fluid">
            <AppNo data={this.state.data} />
        </div>
    );
}
});

ReactDOM.render (<App />,document.getElementById('app'));

有人能告诉我什么错吗?

1 个答案:

答案 0 :(得分:0)

您试图迭代object而非arrayobjects没有map方法。在App状态下创建数组,一切都应该没问题。

数据示例

data: [
    {
        id: '1',
        name: 'text 1'
    },
    {
        id: '2',
        name: 'text 2'
    }
]

使用您的示例 - http://codepen.io/t1m0n/pen/EKpeve?editors=0010#

检查此笔

您的示例已修复

var AppNo = React.createClass({
    render: function() {
    var dataNodes = this.props.data.map(function(item) {
        return (
            <div key={item.id}>{item.name}</div>
        )
    });
    return (
        <div>
            {dataNodes}
        </div>
    );
}
});
var App = React.createClass({
getInitialState: function() {
    return {
        data: [
            {
                id: '1',
                name: 'text 1'
            },
            {
                id: '2',
                name: 'text 2'
            }
        ]
    }
},
render: function() {
    return (
        <div className="container-fluid">
            <AppNo data={this.state.data} />
        </div>
    );
}
});

ReactDOM.render(<App />,document.getElementById('app'));