如何解决从 mobx 商店获取状态 react js
我只是在学习 React JS。我想在我的应用程序中获取一个以 mobx 状态存储的值。但是不知道如何在功能组件中获取 mobx 状态。
const user_id = observer(({ GlobalStore }) =>
console.log(GlobalStore.user_id)
); // I just need the user ID.
这是完整的代码:
import { observer } from "mobx-react";
import Store from "../mobx/Store";
export const user_id = observer(({ GlobalStore }) =>
console.log(GlobalStore)
);
console.log(user_id);
我的 Store.js 文件如下:
import { observable,action,makeObservable,autorun } from "mobx";
class GlobalStore {
site_title = "ABCD";
app_code = null;
user_id = null;
constructor() {
makeObservable(this,{
site_title: observable,app_code: observable,user_id: observable,update_title: action.bound,update_appcode: action.bound,update_userid: action.bound,});
}
update_title(title) {
this.site_title = title;
}
update_appcode(code) {
this.app_code = code;
}
update_userid(id) {
this.user_id = id;
}
}
const Store = new GlobalStore();
autorun(() => {
console.log("System Checking... OK")
})
export default Store;
解决方法
因为你的商店是一个单例,你可以在任何地方导入它并访问任何字段或方法。
import { observer } from 'mobx-react';
import Store from './Store';
const SomeComponent = observer(() => {
return <div>user_id: {Store.user_id}</div>;
});
我已经制作了 example on Codesandbox
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。