Reactjs 地图返回意外的令牌 }答案

【问题标题】：Reactjs map returns unexpected token }Reactjs 地图返回意外的令牌 }
【发布时间】：2015-01-22 08:27:59
【问题描述】：

我一直在寻找这个错误，但在任何地方都没有找到它。我是 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};
    }
});

我指出了错误发生的行。

Uncaught SyntaxError: Unexpected token }

我认为我不需要添加任何其他信息，因为所有其他功能都可以正常工作，这是唯一返回错误的内容。希望大家能帮帮我。

【问题讨论】：

标签： javascript map token reactjs

【解决方案1】：

由于messages 是一个数组，并且您的组件应该返回一个元素，您应该用另一个组件包装它：

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

【讨论】：

另见this answer。你只需要 {expression} 来转义 JSX 上下文。例如return foo 与 return <div>{foo}</div>.