facebookarchive / flux

Application Architecture for Building User Interfaces
https://facebookarchive.github.io/flux/
Other
17.42k stars 3.47k forks source link

Flux container breaks class methods defined with class properties syntax #486

Open MarkPare opened 4 years ago

MarkPare commented 4 years ago

I have a component like this:

class MyComponent extends React.Component<Props, State> {

  static getStores() {
    return [MyStore];
  }

  static calculateState(prevState:State, props:Props):State {
    return {};
  }

  doSomething = () => {
    console.log('doSomething');
  }

  render() {
    this.doSomething();
    return null;
  }
}

export default MyComponent;

When component renders, 'doSomething' is called correctly. However, when I change the export to this:

export default Container.create(MyComponent, {
  pure: false,
  withProps: true,
});

the doSomething method becomes undefined and I get Uncaught TypeError: this.doSomething is not a function

My babel config looks something like this:

{
    "presets": ["@babel/preset-react"]
    "plugins": [
      "@babel/plugin-transform-flow-strip-types",
      "@babel/plugin-proposal-class-properties"
    ]
}

Related deps with versions:

flux@3.1.3
react-dom@16.13.1
react@16.13.1
@babel/core@7.9.0
@babel/plugin-proposal-class-properties@7.8.3
@babel/plugin-transform-flow-strip-types@7.9.0
@babel/polyfill@7.8.7
@babel/preset-env@7.9.0
@babel/preset-react@7.9.1
@babel/register@7.9.0
babel-loader@8.1.0
webpack@4.42.0

This was not an issue up until yesterday (3/20/2020). I still haven't figured out what the issue is but have narrowed it down to the use of Container.create.

Anyone else running into this?

pmysinski commented 4 years ago

I had similar problem. It might be correlated to @babel/preset-env@7.9.0 update https://github.com/babel/babel/releases/tag/v7.9.0 It was released 20 Mar. My issue was with @babel/plugin-transform-classes dependency of @babel/preset-env Downgrading @babel/plugin-transform-classes by adding to package.json works for me for now.

"devDependencies": {
    "@babel/plugin-transform-classes": "7.8.6",