Question

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

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

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

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

此问题是否有解决方法？

Answer 1

如果您将babel与es6一起使用，则可以将其转换为（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)将返回另一个显然没有为原始类指定的静态方法的函数。

在ES6类中未定义静态方法，并在reactjs中使用装饰器

1 个答案: