在Reactjs + MobX中加载组件后如何执行功能？

Question

我刚开始使用React + MobX，所以我还不完全了解它们的工作原理。

我只想在转到getUserDataFromAPI()并加载组件ProfileStore时才执行功能http://localhost:3000/profile（在ProfileComponent中）。>

这是我现在拥有的：

几个商店在rootStore中初始化。

RootStore.js

class RootStore {
    constructor() {
        this.profileStore = new ProfileStore(this)

        [other randomStores]
    }
}

然后，在ProfileStore.js中，我有：

ProfileStore.js

constructor(rootStore) {
    this.rootStore = rootStore

    runInAction('Load Profile', async () => {
        await this.getUserDataFromAPI()
    });
}

我仍然不知道runInAction做什么，但是主要的问题是ProfileStore's constructor被执行而不管我要加载的组件是什么，因为它是用rootStore初始化的。

如何导航到/profile并加载Profile Component时才执行该功能？

我刚开始使用React + MobX，所以我还不完全了解它们的工作原理。我希望仅当我访问http：// localhost：3000 / ...