如何在命名空间中使用装饰器: MobX

Question

我在客户端代码中使用MobX，如下所示：

<script src="/js/mobx.umd.js"></script>
<script src="/js/mobx-react/index.min.js"></script>

现在，当我想像下面这样实际使用MobX时，它不起作用，也就是说，我的客户端用户界面不会对可观察到的变量的变化做出反应：

const action=window.mobx.action
const observable=window.mobx.observable

class Store {

    @observable isLoggedIn=false;
    @action setIsLoggedIn=(tf)=>{this.isLoggedIn=tf}
}

我想知道如何将window.mobx.action和window.mobx.observable与ES6一起使用。

以前，我在NPM中使用MobX，如下所示，它运行得很好：

import { action, observable } from 'mobx'

Answer 1

装潢师只能通过巴贝尔/打字稿的转换来支持。有关ES5语法，请参见https://mobx.js.org/best/decorators.html

Answer 2

class Store {
   isLoggedIn = observable(false);
   setIsLoggedIn= action((tf)=>{this.isLoggedIn=tf});
}