Eslint错误:多行周围缺少括号JSX react / jsx-wrap-multilines

时间:2019-06-25 16:41:07

标签: reactjs material-ui jsx eslint

我在我的项目中使用Material UI复选框。我以与在Material UI示例中使用的相同的方式使用它:https://material-ui.com/components/checkboxes/ 但是eslint向我显示了此错误:

错误多行JSX react / jsx-wrap-multilines周围缺少括号

<FormControlLabel
  control={
    <Checkbox
      checked={data.default}
      value="default"
      onChange={(e) => {
        return setData({ ...data, default: e.target.checked });
      }}
    />
  }
  label="Make default"
/>

第2行出现错误(control = {....)

1 个答案:

答案 0 :(得分:0)

请参见jsx-wrap-multilines rule page上的示例:

您可以禁用该规则,也可以将任何多行React元素包装在括号中

<FormControlLabel
  control={( // starting paren here
    <Checkbox
      checked={data.default}
      value="default"
      onChange={(e) => {
        return setData({ ...data, default: e.target.checked });
      }}
    />
  )} // ending paren here
  label="Make default"
/>