s-l*_*ndz 5 node.js reactjs mobx next.js mobx-state-tree
我在 NextJS 应用程序上使用 mobx-state-tree 进行服务器端渲染。仅在服务器上,我获取 API 来加载一些信息并添加到我的商店。但是在客户端加载之后,我的存储被清除,因为我需要在服务器和客户端上实例化。这是我的问题。
我的商店:
const Store = types
.model('Store', {
user: types.compose(User),
});
const createStore = Store.create({
user: {},
});
let store = null;
/**
* Init store
*
* @param {bool} isServer
* @param {object} snapshot
*/
const initStore = (isServer, snapshot = null) => {
if (isServer) {
store = createStore;
}
if (store === null) {
store = createStore;
}
if (snapshot) {
applySnapshot(store, snapshot);
}
return store;
};
Run Code Online (Sandbox Code Playgroud)
我在客户端的组件:
static getInitialProps({ req }) {
const isServer = !!req;
const store = initStore(isServer);
return { initialState: getSnapshot(store), isServer }
}
constructor(props) {
super(props);
this.store = initStore(props.isServer, props.initialState);
}
Run Code Online (Sandbox Code Playgroud)
还有我的用户商店:
const User = types
.model('User', {
name: types.optional(types.string, ''),
first_name: types.optional(types.string, ''),
})
.actions(self => {
function load(name) {
self.name = name;
};
async function afterCreate() {
if (IS_SERVER) {
const request = await callApi();
return self.load(request.user.name);
}
};
return {
load,
afterCreate
};
})
.views(self => ({
get userName() {
return self.name;
},
}));
Run Code Online (Sandbox Code Playgroud)
我的操作 self.load(name) 正在运行,但在客户端加载时被删除。
有人知道如何从服务器端“保存”用户存储吗?
谢谢你!
| 归档时间: |
|
| 查看次数: |
1053 次 |
| 最近记录: |