我是React with Rails和react-rails
gem的新手。
我正在尝试遍历所有电梯并通过电梯组件显示电梯名称。
控制器操作索引提供:
class LiftsController < ApplicationController
def index
@lifts = Lift.all
end
end
在assets/javascripts/components
下,我有一个 lift.js.jsx 组件。
class Lifts extends React.Component {
render() {
const arr = {this.props.data}.map((x) => <li>Hello {x.liftname}!</li>);
return (<ul>{arr}</ul>);
}
}
在视图页面中,我传递的数据如下所示:
<%= react_component('Lifts', data: @lifts) %>
但是,我收到错误:
SyntaxError: unknown: Unexpected token (3:20)
1 | class Lifts extends React.Component {
2 | render() {
> 3 | const arr = {this.props.data}.map((x) => <li>Hello {x.liftname}!</li>);
| ^
4 | return (<ul>{arr}</ul>);
5 | }
6 | }
我的问题是:
- 我哪里出错了
- 是否有任何用于 react 的调试器,除了意外的令牌之外还提供更多信息?
在第一种情况下,可能这一行应该没有大括号,如下所示:
const arr = this.props.data.map((x) => <li>Hello {x.liftname}!</li>);
你还必须为每个li
项目定义key
道具,否则 React 会发出警告。