Javascript React和Mobx-加载API数据？

我必须验证用户是否使用某种令牌登录，在下一个示例中，当前已设置该令牌以进行测试

我可以想到两个选择

选项1

在商店的构造函数上执行此操作：

export class MyStore {

    @observable token = "sometoken";
    @observable authenticated = false;

    constructor() {
        this.checkAuth();
    }

    @action
    checkAuth() {
        fetch("http://localhost:3001/validate/" + this.token)
            .then(res => res.json())
            .then(data => {
                this.authenticated = data.validated;
            });
            // catch etc
    }
}

选项2:

在使用数据的组件中执行此操作，

componentDidMount

方法

---

这两种方法都有效，但处理这种状态的最佳实践是什么呢？

我肯定会选择第一种方法。如果您并不总是需要身份验证（例如某些部分是公共的），那么就不要在存储构造函数中调用

this.checkAuth（）

。如果所有部分都需要身份验证，那么它看起来就像这样。 应避免选项2，因为这将导致不必要的到服务器的往返，以重新验证已验证的令牌。总的来说，MobX提供了很好的工具，可以最大限度地减少生命周期方法的使用，并编写更干净的代码