3

I'm using eslint-plugin-immutable so I can't use this keyword (I can eslint-disable-line, but I don't want to), so I'm wondering if there is any way with recompose to access the props inside any of the mount lifecycle, without using the this keyword.

const enhance = compose(
  lifecycle({
    componentWillMount() {
      const { props } = this // throws eslint error
      console.log(this.props); // works, throws eslint error
    },
  }),
);
KadoBOT
  • 2,944
  • 4
  • 16
  • 34
  • Why would eslint complain about *references* to `this`? You basically cannot get around `this` in JavaScript; it's fundamental to the object model. – Pointy Jun 29 '17 at 11:06
  • Beucase of eslint-plugin-immutable, there is a rule called no-this – KadoBOT Jun 29 '17 at 11:18
  • Well like I said, if you're working with JavaScript prototype code it's pretty hard to get around making references to `this`; it basically makes using such code impossible or at best pointless. – Pointy Jun 29 '17 at 11:58
  • Maybe you are right. But that's not the point, just wanna know if it's possible or not. That doesn't mean I'll do it. – KadoBOT Jun 29 '17 at 12:00
  • Reading the documentation for that plugin, it's explicitly trying to force you to code in a particular style. If you don't want to write your code that way, don't use the plugin I guess. – Pointy Jun 29 '17 at 12:00

2 Answers2

1

You can use with-lifecycle HOC which was written exactly for this purpose. Your example:

import withLifecycle from '@hocs/with-lifecycle';

const enhance = compose(
    withLifecycle({
        onWillMount(props) {
            console.log(props);
        },
    }),
);
deepsweet
  • 501
  • 3
  • 7
0

It's impossible to access props without using this keyword in lifecycle. If you frequently have the same feature need to use lifecycle methods, you can implement your own HOC, still have to use this, but outside that yout don't have to write this, like recompose/shouldUpdate.

Isaddo
  • 438
  • 4
  • 10