javascript - MobX 状态树中带有“流”的生成器语法
问题描述
我在 MobX 状态树存储中执行了三个操作:第一个从 API 获取数据,第二个使用数据库中 API 的数据发送 POST 请求,第三个获取响应并将其保存到存储中。
存储只是由这些称为列表的数据结构的映射组成:
export const ListStore = types
.model('ListStore', {
lists: types.map(List),
})
发送 GET 和 POST 请求的前两个操作可以正常工作:
.actions((self) => ({
fetchTitles: flow(function* fetchTitles(params: Params) {
const env = getStoreEnv(self);
const { clients } = env;
const browseParams: BrowseParams = {
category: 'movies',
imdb_score_min: params.filter.imdbFilterScore,
};
let browseResult;
try {
browseResult = yield clients.browseClient.fetch(browseParams);
} catch (error) {
console.error('Failed to fetch titles', error);
}
return browseResult.data.results.map((title) => title.uuid);
}),
}))
.actions((self) => ({
postList: flow(function* postList(params: Params) {
const env = getStoreEnv(self);
const { clients } = env;
const titles = yield self.fetchTitles(params);
return clients.listClient.create({
name: params.name,
titles,
invites: params.invites,
filter: params.filter,
});
}),
}))
但是当涉及到第三个动作时,实际上将 List 保存到 ListStore,就没有这样的运气了。我已经尝试了很多变体,但它们都不起作用。老实说,我对生成器语法不太熟悉,我什至尝试在没有生成器的情况下这样做。在这里你可以看到我的尝试:
createList: flow(function* createList(params: Params) {
const env = getStoreEnv(self);
const list = yield self.postList(params);
console.log('list in createList', list.data);
return self.lists.put(List.create({ ...list.data }, env));
// return self.lists.set(list.id, list.data);
}),
createList: flow(function* createList(params: Params) {
const list = yield self.postList(params);
console.log('list in createList', list.data);
yield self.lists.set(list.id, list.data);
}),
createList(params: Params) {
return self.postList(params).then((list) => {
console.log('list in createList', list.data);
self.lists.set(list.id, list.data);
});
},
createList: flow(function* createList(params: Params) {
yield self.postList(params).then((list) => {
console.log('list in createList', list.data);
return self.lists.set(list.id, list.data);
});
}),
我都尝试过.set()
and .put()
,但无济于事。我也尝试过使用yield
并且return
...似乎没有任何效果。登录的数据console.log('list in createList', list.data);
看起来正确并与模型匹配(如果不正确,我会不会收到错误消息?)。没有错误记录到控制台,它只是默默地失败。
如果您能发现错误并查看应该如何编写,我将非常感激。谢谢!
解决方案
事实证明,问题不在于语法:正如您在 MST 维护者的第一条评论中看到的那样,第二个版本是正确的。
问题在于模型(此处未显示)的创建方式。
推荐阅读
- python - 手动更改的量化权重未反映在 state_dict()
- c++ - 错误 LNK2019:函数 _main 中引用的未解析外部符号“public:__thiscall RNG::RNG(unsigned __int64)”(??0RNG@@QAE@_K@Z)
- apache-nifi - 恢复 NiFi 项目
- asp.net-mvc - 使用 MVC 5 创建 OAuth2.0 登录应用程序
- java - 弄清楚用户是否输入了数值或其他内容?
- javascript - 如何在我的 Vuex 商店中返回 Promise 而不会收到错误消息?
- html - 这个网格容器的高度是如何计算的?
- excel - 在 Excel 中根据两个或多个条件插入行
- r - 面临访问闪亮模块动态输入值的问题
- android - 如何允许最终用户将数据添加到 JSON 文件