I am confused about the lifecycle sequence in 16.3

[stunstunstun]

I defined the rules through the issues below which are confusing to me.

• Add support for React 16.3 lifecycle methods in sort-comp jsx-eslint/eslint-plugin-react#1771

class Textarea extends Component {
  constructor(props) { // lint error!: constructor should be after getDerivedStateFromProps
    super(props)
    this.state = {
      count: 0,
    }
    this.handleChange = this.handleChange.bind(this)
  }

  static getDerivedStateFromProps(nextProps, prevState) {
  ...
  }
...
}

Of course I know it is because of static keyword. How should I change the current rule below?

.eslintrc

"react/sort-comp": ["warn", {
      "order": [
        "static-methods",
        "lifecycle",
        "everything-else",
        "render"
      ],
      "groups": {
        "lifecycle": [
          "displayName",
          "propTypes",
          "contextTypes",
          "childContextTypes",
          "mixins",
          "statics",
          "defaultProps",
          "constructor",
          "instance-variables",
          "getDefaultProps",
          "state",
          "getInitialState",
          "getChildContext",
          "getDerivedStateFromProps",
          "componentWillMount",
          "UNSAFE_componentWillMount",
          "componentDidMount",
          "componentWillReceiveProps",
          "UNSAFE_componentWillReceiveProps",
          "shouldComponentUpdate",
          "componentWillUpdate",
          "UNSAFE_componentWillUpdate",
          "getSnapshotBeforeUpdate",
          "componentDidUpdate",
          "componentDidCatch",
          "componentWillUnmount"
        ]
      }
    }]

[ljharb]

The React 16.3 additions haven’t yet been added to eslint-plugin-react; see jsx-eslint/eslint-plugin-react#1767

As far as it’s concerned at the moment, getDerivedStateFromProps is just an arbitrary method that starts with “get”.

[ljharb]

Specifically tho, it’s becsuse you have “statics” before “constructor”.

[stunstunstun]

@ljharb Thanks, but It has nothing to do with the statics of the lifecycle array. I just want to use one of the lifecycle functions w/static getDerivedStateFromProps(nextProps, prevState) and I just don't want to delete the keyword static-method from the order array below.

As-is

As shown above, a lint error occurred.

order: [
    'static-method',
    'lifecycle',
    'everything-else',
    'render'
  ],

To-be

Of course this works well.

order: [
    'lifecycle',
    'everything-else',
    'render'
  ],