Question

我正在关注关于react.js的Grinder教程，其中涉及创建burgerapp。我收到错误消息：

Line 6:  Expected an assignment or function call and instead saw an expression  no-unused-expressions

我自己尝试之后，我从完成的项目中复制了他的文件，并得到了完全相同的错误，所以现在我很困惑，如果问题出在其他地方，我可能是盲目的或者他的教程不是最新的。已经尝试添加return语句并更改为花括号。请记住，我在其他stackoverflow中看到了此代码，但看起来完全一样。

我的代码：

const controls = [
    { label: 'Salad', type: 'salad' },  //line 6 studio code says error is here
    { label: 'Bacon', type: 'bacon' },
    { label: 'Cheese', type: 'cheese' },
    { label: 'Meat', type: 'meat' },
];


const buildControls = (props) => (
<div className ={"BuildControls"}>
    {controls.map(ctrl =>(
        <BuildControl key={ctrl.label} label={ctrl.label}/>
))}
    </div>
);
export default buildControls;

应用程序应该开始显示构建控件，但现在它甚至还没有编译。在这个主题上，请不要太苛刻。

Answer 1

尝试这样的事情：

const buildControls = (props) => {

  const controlItems = controls.map(ctrl =>
    <BuildControl key={ctrl.label} label={ctrl.label}/>
  );

  return(
  <div className ={"BuildControls"}>
    {controlItems}
  </div>
  );

};

Answer 2

确定找到的解决方案是我是盲人，问题出在不同的文件中，没有return语句的花括号，添加return以后是固定的。 BuildControls中显示了错误，但BuildControl中出现了问题。

const BuildControl = (props) => {};

应该是

const BuildControl = (props) => ();

如何修复reactjs中的“预期的分配或函数调用，而看到一个表达式”？

2 个答案: