Unexpected block statement surrounding arrow body

Question

I'm using "eslint-config-airbnb": "^6.1.0", to keep my JavaScript clean.

My linter is unhappy with what seems to be legitimate code:

It seems like this might be an ongoing issue. Does anyone have any suggestions for an OCD developer on how to address this in the meantime? Perhaps disabling this rule or otherwise?

Answer 1

The block statement isn't needed for a single expression.

this.state.todos.filter(filterTodo => filterTodo !== todo);

Answer 2

To add on Kevin answer, the error is related to your eslint configuration. This said, if arrow-body-style option is set to true, OP is correct. An other example would be something like this :

    return this.state.greetings.map((name) => {
        return <HelloWorld key={name} name={name} />;
    });

Without arrow-body-style option, block statement ( { return ...} ) is not needed as per Kevin answer.

This actually open a new question as to which style is more appropriate.

For further references : http://eslint.org/docs/rules/arrow-body-style

Answer 3

If you really don't want to wrap arrow function inside block statement then you can turn off.

module.exports = {
  extends: "airbnb-base",
  rules: {
    "arrow-body-style": 0
  },
  "env": {
    "jest": true
  }
};