`class-methods-use-this`: "exceptMethods" array option

What version are you using? 3.4.0

What did you do? Enabled class-methods-use-this and ran it on this code:

import React from 'react';

class Foo extends React.Component {
  componentDidMount() {
    doSomethingHereWithLogging();
  }
}

What happened? Expected 'this' to be used by class method 'componentDidMount'

What did you expect to happen? What I would like to happen is to be able to specify “componentDidMount”, and all the other React lifecycle methods, as exceptions to this rule. In other words, the typical reasoning for a class method is that it needs access to this - but in the case of React components, the lifecycle methods provide context-based hooks that don’t necessarily require this. A generic “exceptMethods” array would allow me to manually specify component lifecycle methods, and exempt them from this rule, without losing its general utility.

[ljharb]

Essentially: "class-methods-use-this": [2, { "exceptMethods": ["componentDidMount"] }], where “exceptMethods” defaulted to [] and was always concatenated to ["constructor"] (ie, the default behavior).

Good code with the option:

class Foo extends React.Component {
  componentDidMount() {
    doSomethingHereWithLogging();
  }
}

Bad code without the option, or with an empty array:

class Foo extends React.Component {
  componentDidMount() { // warning here
    doSomethingHereWithLogging();
  }
}

class Bar extends React.Component {
  componentDidMount() { // warning here
    doSomethingHereWithLogging();
  }

  foo() { // warning here
    return 3;
  }
}

Bad code with the option:

class Foo extends React.Component {
  componentDidMount() {
    doSomethingHereWithLogging();
  }

  foo() { // warning here
    return 3;
  }
}

[mathieumg]

There’s a few more for React, that eslint- config-airbnb defines.

For reference, https://github.com/airbnb/javascript/blob/8468ed842314a5d66816927ba6c35f018035cffc/packages/eslint-config-airbnb/rules/react.js#L22-L33

I don’t use external configurations, that’s why posted my snippet. 😃 That being said, I forgot about context (it’s not on the React lifecycle page since it’s still technically not officially supported) and I use class properties that’s why I didn’t include getInitialState and getDefaultProps, I actually thought about it but figured it was only for the createClass approach, which is obviously not true, I’ve just grown so accustomed to class properties already. Thanks for pointing these out!