在ES6类中未定义静态方法，并在reactjs中使用装饰器 [英] Static method is undefined in ES6 classes with a decorator in reactjs

问题描述

我有一个带装饰器的ES6课程。它有一个静态方法foo。但是当我尝试访问静态方法时，它是未定义的。

I have an ES6 class with a decorator. It has a static method foo. However when I try to access the static method, its undefined.

@withStyles(styles)
class MyComponent extends Component {
    static foo(){
        return "FOO";
    }
    render(){
        var x = MyComponent.foo; // x=undefined
    }
}

当我删除装饰器时可以访问静态方法。它不再是未定义的。

When I remove the decorator I can access the static method. Its no longer undefined.

class MyComponent extends Component {
    static foo(){
        return "FOO";
    }
    render(){
        var x = MyComponent.foo; // x=foo()
    }
}

是否有解决方法对于这个问题？

Is there a workaround for this issue?

推荐答案

如果你使用 babel 带 es6 ，它可以像那样（到 es5 ）进行转换：

If you're using babel with es6, it could be transpiled like that (to es5):

var MyComponent = (function () {
  function MyComponent() {
    _classCallCheck(this, _MyComponent);
  }

  _createClass(MyComponent, null, [{
    key: 'foo',
    value: function foo() {
      return "FOO";
    }
  }]);

  var _MyComponent = MyComponent;
  Foo = withStyles(MyComponent) || MyComponent;
  return MyComponent;
})();

所以它的问题是 withStyles（MyComponent）将返回另一个显然没有为原始类指定的静态方法的函数。

So its problem is that withStyles(MyComponent) will return another function which obviously doesn't have static methods you specified for original class.

这篇关于在ES6类中未定义静态方法，并在reactjs中使用装饰器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！