问题标签 [mobx]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - MobX - 在另一个商店中运行一个商店的构造函数?
所以我有 2 家商店,一个AuthorStore
:
和一个BookStore
:
我不断收到一个错误,BookStore
因为它无法获取 的属性null
,就好像AuthorStore.author.name
为空一样。因此,它在没有首先运行构造函数的情况下author
从 中读取默认值AuthorStore
来为其分配值。
如何获取AuthorStore
构造函数分配给author
的值BookStore
?
mobx - MobX - 在使用 fromPromise 的存储构造函数中承诺的可观察值在另一个存储中访问时保持为空?
所以我有 2 家商店,一个AuthorStore
:
和一个BookStore
:
我不断收到一个错误,BookStore
因为它无法获取 的属性null
,就好像AuthorStore.author.name
为空一样。因此,它在没有首先运行构造函数的情况下author
从 中读取默认值AuthorStore
来为其分配值。
我遇到了新的mobx-utils
fromPromise
,我认为author
如果它存在于本地存储中,它会获得该值,并等待AsyncStorage
将其分配给author
可观察对象,因此可以从另一个存储中调用它而不是null
.
我尝试在 中使用fromPromise
firstAuthorStore
来记录author
值,但它undefined
在控制台中显示为 Got ,并且在涉及该部分时通常null
出现错误。BookStore
AuthorStore.author
更新:
如何获取计算函数fromPromise
分配的值以将承诺的值返回到under ?AuthorStore
theAuthor
authorPromise
BookStore
authorName
javascript - Mobx - React:一起注入和观察
最近我开始使用 mobx 和 react 和 mobx-react 库。
我想使用功能性 React 组件来创建我的视图。
我想创建一个辅助函数,它采用选择器函数和组件,调用注入(以选择器函数作为参数)并观察该组件 - 有效地将这个组件连接到 mobx-react 存储(取自提供者上下文)并且只提供此组件所需的属性。
但我无法让它工作。正在调度操作,但视图不会对此更改做出反应(存储属性确实会更改,但组件不会对此更改做出反应)。
这是我的辅助功能:
这是我的组件:
这是我的商店:
(没有显示提供者和其他简单的东西,但它设置正确)。
谢谢!每个答案都非常感谢。
javascript - MobX 计算在项目实际插入数组之前运行
我将 React 与 MobX 结合使用。我使用带有可观察数组(对话)的商店,并希望提供该数组的排序版本作为计算属性。添加新对话时,计算属性 sortedConversations 在对话添加到数组之前进行评估。在下面的小示例中,“重新排序对话”总是在“添加对话”之前记录。难道我做错了什么?
javascript - 你如何将 mobx 与 react rails 一起使用?
在尝试使用react-rails时,我遇到了将mobx
状态管理合并到我的应用程序中的问题。
我的印象是 rails 资产管道会引入 mobx 做出反应,但是,这并没有成功。我正在使用react-rails gem并尝试将 mobx 合并到组件文件夹中的 react.es6.jsx 工作表中。
我的 package.json 文件:
我的第一个反应文件包含在/components
:
但我不断收到错误VM3275:1 Uncaught ReferenceError: SearchResultsLayout is not defined
有任何想法吗?
reactive-programming - mobx 反应不稳定,循环功能
我正在尝试使用 MobX 创建 Otello 游戏。所以我有反应去寻找瓦片的变化,然后相应地更新其他瓦片。
所以在下面的代码中,我跑去bumpRandom()
换另一个瓦片看看效果。但是这会进入循环函数,因为reaction
总是运行。如何让它停止在 a 中观察reaction
?
我试过untracked(() => this.bumpRandom())
了,但这也不起作用。
reactjs - 使用带有 create-react-app 的 MobX 可观察装饰器
MobX文档告诉我,我必须“使用转换插件 transform-decorators-legacy 并确保它在插件列表中排在第一位”,才能让装饰器工作。MobX 样板项目建议我需要一个.babelrc
类似的东西:
如何使用 create-react-app 生成的项目来做到这一点?任何使用装饰器的尝试都会@
出错。.babelrc
甚至在项目“退出”之后也没有。
javascript - MobX - 将所有商店可观察对象重置回初始状态?
给定一家MyQuestionStore
商店:
将所有 store observables 重置为其初始状态数据('today'/false/0/null/etc..)的正确方法是什么?
注意:例如,我认为这是一种很好的MobXMyQuestionStore.reset()
方式,但我认为它不存在。我将不得不编写一个名为reset
并手动将每个可观察对象重置回其初始状态的操作。我认为这不是正确的方法,因为如果我添加 more ,我每次observables
都必须手动将它们添加到操作中。reset
javascript - 使用 mobx 进行延迟加载的惯用方法
使用 MobX 时延迟加载属性的当前惯用方式是什么?
我已经为此苦苦挣扎了几天,自从严格模式成为一件事以来,我还没有找到任何好的例子。我喜欢严格模式的想法,但我开始认为延迟加载与它不一致(访问或观察属性应该触发加载数据的副作用,如果它不存在的话)。
这是我问题的症结所在,但要了解我是如何到达这里的,请继续阅读。
我当前设置的基础知识(没有发布大量代码):
反应组件 1 (ListView):componentWillMount
- componentWillMount & componentWillReceiveProps - 组件从路由参数(react-router)中获取过滤器值,将其保存为 ListView 上的可观察对象,并告诉商店根据它获取“提案”
- Store.fetchProposals 检查该请求是否已经发出(请求存储在 ObservableMap 中,通过序列化过滤器对象的键,因此两个相同的过滤器将返回相同的响应对象)。它在需要时发出请求并返回包含有关请求是否完成或有错误的信息的可观察响应对象。
- ListView 将可观察的响应对象保存为属性,因此它可以显示加载或错误指示器。
- ListView 有一个计算属性,它使用用于获取的相同过滤器对象调用 Store.getProposals
- Store.getProposals 是一个转换器,它接受一个过滤器对象,从 ObservableMap 获取所有提案(proposal.id 上的键),使用过滤器对象过滤列表并返回一个 Proposal[] (如果没有匹配过滤器,则为空,包括如果没有提案已加载)
这一切似乎运作良好。
问题是提案具有客户端和客户端 ID 的属性。Proposal.clientId 是与提案一起加载的字符串。我想等到客户端被实际访问以告诉商店从服务器获取它(假设它还没有在商店中)。在这种情况下,ListView 恰好显示了客户端名称,因此它应该在 Proposal 之后立即加载。
我最接近的方法是在提案的构造函数列表中设置一个自动运行,但其中一部分没有对我正在缩进的地方做出反应。(截断相关部分):
响应对象是可观察的:
我感觉我正在与系统作斗争,并且在构造函数中设置自动运行似乎并不理想。有人以合理的方式解决此模式吗?如果我的设置看起来很疯狂,我愿意接受关于整个事情的建议。
编辑 1:为清楚起见,删除了 @Mobx。
编辑 2:试图重新评估我的情况,我(再次)找到了优秀的 lib mobx-utils,它有一个可以满足我需要的lazyObservable函数。目前它看起来像这样:
这是有效的!
我想我需要那里的自动运行来根据这个对象的 clientId/clientFilter 属性进行更新(如果这个对象后来被分配给一个新的客户端,我希望更新lazyObservable)。我不介意惰性属性的一些样板,但我绝对愿意接受那里的建议。
如果这最终成为要走的路,我还将从同一个库而不是我的可观察请求对象中查看fromPromise 。不确定,因为我正在跟踪开始时间以检查是否过时。链接在这里以防其他人没有遇到它:)
mobx - 级联动作不渲染
我正在做这样的事情:
这些动作是分开的,因为有时会fetchAnother
被自己调用。
我将 store 注入到我的 React 组件类中。当fetch
被调用时,包装在其中的第一个异步回调会action
更新页面并urlData1
呈现。然后调用并执行第二个回调fetchAnother
,但不渲染,并且urlData2
仅在我以其他方式强制重新渲染时才会显示。为什么,我该如何解决?