javascript - 意外的令牌,预期的...
问题描述
我在反应中收到以下错误
意外的令牌,预期的...... (16:6)
return (
15 | <div className={classes.BuildControls}
16 | { controls.map(el =>(<BuildControl key={el.label} label={el.label} />))}
| ^
17 | </div>
18 | )
19 | };
这是我的代码
import React from 'react';
import Classes from './build-controls.css';
import BuildControl from './build-control-r/build-control.js';
const controls = [
{ label: "Salad", type:"salad" },
{ label: "Cheese", type:"cheese" },
{ label: "Meat", type:"meat" },
{ label: "bacon", type:"bacon" }
]
const buildControls = (props) => {
return (
<div className={classes.BuildControls}
{ controls.map(el =>(<BuildControl key={el.label} label={el.label} />))}
</div>
)
};
export default buildControls;
[问题]:有人可以告诉我我做错了什么吗?如果我还需要分享其他内容,请告诉我
解决方案
您忘记关闭第一个 div。
import React from 'react';
import Classes from './build-controls.css';
import BuildControl from './build-control-r/build-control.js';
const controls = [
{ label: "Salad", type:"salad" },
{ label: "Cheese", type:"cheese" },
{ label: "Meat", type:"meat" },
{ label: "bacon", type:"bacon" }
]
const buildControls = (props) => {
return (
<div className={classes.BuildControls}> //This one right arrow
{ controls.map(el =>(<BuildControl key={el.label} label={el.label} />)) }
</div>
)
};
export default buildControls;
推荐阅读
- mysql - 根据另一个表中的条件创建新列
- java - 如何回滚 Firebase 实时数据库中的更改 - Android
- vba - 将成功和失败消息都打印到输出文件,错误处理程序来得太晚了?
- javascript - svg 无法在 IE 中正常显示工具提示,但在 Chrome 中正常显示
- mapbox - Mapbox Geocoding API 中的荷兰邮政编码
- amazon-cloudsearch - 如何编写此 Cloudsearch 查询
- javascript - 如何使用javascript从带有符号的字符串中获取文本
- php - 如何检查日期范围是否在 PHP 中的另一个日期范围之间
- javafx - 如何在 TableView 中为具有特定条件的特定行着色?
- mongodb - $unset 特定条件下所有数组和文档中数组元素的属性