意外的令牌，预期的...答案

【问题标题】：Unexpected token, expected ...意外的令牌，预期的...
【发布时间】：2018-06-02 14:43:47
【问题描述】：

我在反应中遇到以下错误

意外的令牌，预期的... (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;

[问题]：谁能告诉我我做错了什么？如果我还需要分享其他内容，请告诉我

【问题讨论】：

你没有在 className 之后关闭你的 div。将> 放入打开的 div 块中
行得通，非常感谢基尚
@KishanMundha 由于您最初解决了这个问题，如果您将此添加为答案，我很乐意将其标记为已回答:)
我已经添加了答案。

标签： javascript reactjs

【解决方案1】：

请关闭元素

const buildControls = (props) => {
  return (
  <div className={classes.BuildControls}> // Need to close bracket
    { controls.map(el =>(<BuildControl key={el.label} label={el.label} />))}
  </div>
 )
};

【讨论】：

【解决方案2】：

您忘记关闭第一个 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;

【讨论】：