围绕箭头体ESlint的意外的块语句

时间:2016-08-13 17:42:12

标签: javascript reactjs ecmascript-6 eslint arrow-functions

为什么这段代码会给我提示lint警告?解决方法是什么?任何帮助将不胜感激。

 const configureStore = () => {
  return createStore(
      rootReducer,
      middleware
    );
};

这是我的eslint配置

{
  "parser": "babel-eslint",
  "extends": "airbnb",
  "plugins": [
    "react"
  ],
  "rules": {
    "comma-dangle": 0,
    "object-curly-spacing": 0,
    "no-multiple-empty-lines": [
      "error",
      {
        "max": 1
      }
    ],
    "arrow-body-style": 1,
    "newline-per-chained-call": 1
  },
  "env": {
    "browser": true,
    "node": true,
    "mocha": true
  }
}

2 个答案:

答案 0 :(得分:1)

在不知道你的特定lint配置的情况下调试有点困难。

我唯一的猜测是你的linter配置方式如果你在一个只包含一个表达式的箭头体上使用一个块就会抱怨

尝试

const configureStore = () =>
  createStore(rootReducer, middleware);

如果不起作用,请提供评论

-

ps,如果您在repl.it中粘贴确切的代码,则没有lint警告

答案 1 :(得分:1)

const configureStore = () => {
  return createStore(
      rootReducer,
      middleware
    );
};

将箭头后的括号更改为括号

const configureStore = () => (
       createStore(
          rootReducer,
          middleware
        );
    );

对我有用。 这是关于arrow-body-style https://eslint.org/docs/rules/arrow-body-style.html

的主题
  

需要箭头功能体中的大括号(箭头 - 体型)   选项   该规则需要一个或两个选项。第一个是字符串,可以是:

     
      
  • "总是"强制执行函数体的大括号
  •   
  • "按需"在没有括号的地方强制执行(默认)
  •   
  • "从未"在函数体周围不强制执行(将箭头函数约束为返回表达式的角色)   当你按需配置时
  •   
//this is a bad style    
let foo = () => {
        return {
           bar: {
                foo: 1,
                bar: 2,
            }
        };
    };
// This is good
let foo = () => ({
    bar: {
        foo: 1,
        bar: 2,
    }
});

您可以从https://eslint.org/docs/rules/arrow-body-style.html#as-needed

中找到更多详情