Reactjs map返回意外令牌}

Question

我一直在寻找这个错误,但没有在任何地方找到它.我是React的新手并遵循一些教程.一切都达到了我试图将数组映射到组件的程度.

所以我使用虚拟数据以较小的形式测试这个功能

var data = [
    {name: 'You', text: 'Test'},
    {name: 'Me', text: 'Testing'}
];

现在我正在尝试打印出一个评论系统,现在我只想打印出用户的名字.我正在为我的应用程序组件提供数据,并将其提供给消息列表.在那里,我试图将它们打印成盒子.

var MessageList = React.createClass({
    render: function() {
        var messages = this.props.data.map(function(msg) { 
            return <MessageBox name={msg.name} />
        });    //**** ERROR HERE ****
        return {messages};
    }
});

我指出了发生错误的行.

未捕获的SyntaxError:意外的令牌}

我不认为我需要添加任何其他信息,因为所有其他功能都正常工作,这是唯一返回错误的东西.希望你们能帮助我.

Answer 1

既然messages是一个数组,并且你的组件应该返回一个单独的元素,你应该用另一个组件包装它:

return (<div>{messages}</div>);