問題タブ [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.

0 投票する
1 に答える
360 参照

javascript - MobX - あるストアのコンストラクターを別のストアで実行しますか?

だから私は2つの店を持っていますAuthorStore

BookStore:

がnullであるかのように、のBookStoreプロパティを取得できないというエラーが発生し続けます。したがって、値を割り当てるために最初にコンストラクターを実行せずに、からデフォルト値を読み取ります。nullAuthorStore.author.nameauthorAuthorStore

AuthorStoreコンストラクターによって割り当てられた値を取得するにはどうすればよいauthorですBookStoreか?

0 投票する
1 に答える
1620 参照

mobx - MobX - fromPromise を使用してストア コンストラクターで約束された監視可能な値は、別のストアでアクセスされたときに null のままですか?

だから私は2つの店を持っていますAuthorStore

BookStore:

がnullであるかのように、のBookStoreプロパティを取得できないというエラーが発生し続けます。したがって、値を割り当てるために最初にコンストラクターを実行せずに、からデフォルト値を読み取ります。nullAuthorStore.author.nameauthorAuthorStore

ローカルストレージに存在する場合に値を取得し、それをオブザーバブルに割り当てるのを待つとmobx-utils fromPromise思われる新しいものに出くわしたので、別のストアから呼び出すことができます。authorAsyncStorageauthornull

fromPromise最初にを使用AuthorStoreして値をログに記録しようとしましたが、コンソールにauthorGot と表示され、パーツに関しては通常のエラーが表示されます。undefinednullBookStoreAuthorStore.author

アップデート:

計算された関数fromPromiseによって割り当てられた値を取得して、約束された値をunderに返すにはどうすればよいですか?AuthorStoretheAuthorauthorPromiseBookStoreauthorName

0 投票する
1 に答える
4788 参照

javascript - Mobx - React: Inject と Observe を一緒に

最近、react と mobx-react ライブラリで mobx を使い始めました。

機能的な React コンポーネントを使用してビューを作成したいと考えています。

セレクター関数とコンポーネントを受け取り、(パラメーターとしてセレクター関数を使用して) inject を呼び出し、そのコンポーネントを監視するヘルパー関数を作成したいと思います - このコンポーネントを mobx-react ストア (プロバイダー コンテキストから取得) に効果的に接続し、このコンポーネントに必要なプロパティ。

しかし、私はそれを機能させることができません。アクションはディスパッチされていますが、ビューはこの変更に反応しません (ストア属性は変更されますが、コンポーネントはこの変更に反応しません)。

これが私のヘルパー関数です:

ここに私のコンポーネントがあります:

そしてここに私の店があります:

(プロバイダーやその他の単純なものは表示されませんが、適切に設定されています)。

ありがとう!すべての答えは大歓迎です。

0 投票する
1 に答える
455 参照

javascript - 項目が実際に配列に挿入される前に計算された MobX の実行

React と MobX を組み合わせて使用​​しています。監視可能な配列 (会話) を持つストアを使用しており、この配列の並べ替えられたバージョンを計算されたプロパティとして提供したいと考えています。新しい会話を追加すると、計算されたプロパティ sortedConversations が評価されてから、会話が配列に追加されます。以下の小さな例では、「会話の並べ替え」は常に「追加された会話」の前に記録されます。私は何か間違ったことをしていますか?

0 投票する
3 に答える
929 参照

javascript - 反応レールでmobxをどのように使用しますか?

react-railsを使用しようとしているmobxときに、状態管理としてアプリに組み込む際に問題が発生しました。

Rails アセット パイプラインが反応する mobx をもたらすという印象を受けましたが、これは成功していません。私はreact-rails gemを使用しており、mobx をコンポーネント フォルダーの react.es6.jsx シートに取り込もうとしています。

私のpackage.jsonファイル:

に含まれている私の最初の反応ファイル/components:

しかし、私はエラーが発生し続けますVM3275:1 Uncaught ReferenceError: SearchResultsLayout is not defined

何か案は?

0 投票する
1 に答える
83 参照

reactive-programming - mobx反応不安定、循環機能

MobX を使用して Otello ゲームを作成しようとしています。そのため、タイルの変更を探して、それに応じて他のタイルを更新するという反応があります。

以下のコードでは、bumpRandom()別のタイルを変更して効果を確認しました。しかし、これは循環機能に入り、reaction常に実行されます。での観察を停止するにはどうすればよいreactionですか?

私は試しuntracked(() => this.bumpRandom())ましたが、それもうまくいきません。

0 投票する
5 に答える
5368 参照

reactjs - create-react-app で MobX の監視可能なデコレータを使用する

MobXのドキュメントには、デコレータが機能するためには、「変換プラグイン transform-decorators-legacy を使用し、それがプラグイン リストの最初にあることを確認する」必要があると書かれています。MobX ボイラープレート プロジェクトは、次の.babelrcようなものが必要であることを示唆しています。

create-react-app で生成されたプロジェクトでそれを行うにはどうすればよいですか? @デコレータのエラーを使用しようとする試み。.babelrcプロジェクトが「排出」された後でもありません。

0 投票する
5 に答える
13453 参照

javascript - MobX - すべてのストア オブザーバブルを初期状態にリセットしますか?

与えられたMyQuestionStore店舗:

すべてのストアオブザーバブルを初期状態データ (「今日」/false/0/null/etc..) にリセットする正しい方法は何でしょうか?

注:たとえば、 MobXMyQuestionStore.reset()の良い方法だと思いますが、存在しないと思います。呼び出されるアクションを作成し、reset各オブザーバブルを手動でリセットして初期状態に戻す必要があります。を追加すると、毎回アクションobservablesに手動で追加する必要があるため、それは正しい方法ではないと思います。reset

0 投票する
1 に答える
2785 参照

javascript - mobxで遅延ロードする慣用的な方法

MobX を使用しているときにプロパティを遅延読み込みする現在の慣用的な方法は何ですか?

私はこれに数日間苦労してきましたが、厳密モードが問題になって以来、良い例は見つかりませんでした。厳密モードのアイデアは気に入っていますが、遅延読み込みはそれと矛盾していると思い始めています (プロパティにアクセスまたは監視すると、データがまだ存在しない場合、データを読み込むという副作用が発生するはずです)。

それが私の質問の核心ですが、私がどのようにしてここにたどり着いたかを確認するには、読み続けてください.

私の現在のセットアップの基本(大量のコードを投稿せずに):

React コンポーネント 1 (ListView): componentWillMount

  1. componentWillMount & componentWillReceiveProps - コンポーネントは、ルート パラメーター (react-router) からフィルター値を取得し、ListView で監視可能なオブジェクトとして保存し、それに基づいて「提案」をフェッチするようにストアに指示します。
  2. Store.fetchProposals は、そのリクエストがすでに作成されているかどうかを確認します (リクエストは ObservableMap に格納され、フィルター オブジェクトをシリアル化することによってキーが保存されるため、2 つの同一のフィルターが同じ応答オブジェクトを返します)。必要に応じてリクエストを行い、リクエストが終了したかエラーがあるかに関する情報を含む監視可能なレスポンス オブジェクトを返します。
    1. ListView は、監視可能な応答オブジェクトをプロパティとして保存するため、読み込みまたはエラー インジケーターを表示できます。
    2. ListView には、フェッチに使用されるのと同じフィルター オブジェクトを使用して Store.getProposals を呼び出す計算済みプロパティがあります。
    3. Store.getProposals は、フィルター オブジェクトを受け取り、ObservableMap (proposal.id のキー) からすべての提案を取得し、フィルター オブジェクトを使用してリストをフィルター処理し、Proposal[] を返すトランスフォーマーです (フィルターに一致するものがない場合を含め、フィルターに一致するものがない場合は空です)。プロポーザルはまだ読み込まれています)

これはすべてうまくいくようです。

問題は、プロポーザルに client と clientId のプロパティがあることです。Proposal.clientId は、提案と共に読み込まれる文字列です。クライアントが実際にアクセスされて、ストアにサーバーからフェッチするように指示するまで待ちたいです(まだストアにない場合)。この場合、ListView はたまたまクライアント名を表示するため、プロポーザルの直後にロードする必要があります。

私が得た最も近いものは、提案のコンストラクターリストに自動実行を設定することですが、その一部は、私が意図している場所に反応していません。(関連するセクションに切り捨てられます):

応答オブジェクトは観察可能です:

システムと戦っているような気がしますが、コンストラクターで自動実行を設定するのは理想的ではないようです。このパターンを合理的な方法で解決できる人はいますか? 私のセットアップがおかしく見える場合は、全体的な提案を受け付けています。


編集 1: わかりやすくするために @Mobx を削除しました。


編集 2: 状況を再評価しようとして、(再び) 優れた lib mobx-utilsを見つけました。これには、私のニーズに合う可能性のあるlazyObservable関数があります。現在、次のようになっています。

これは機能しています!

このオブジェクトのclientId/clientFilterプロパティに基づいて更新するには、そこに自動実行が必要だと思います(このオブジェクトが後で新しいクライアントに割り当てられた場合、lazyObservableを更新したいと思います)。怠惰なプロパティの定型文は気にしませんが、そこでの提案には間違いなくオープンです。

これが最終的に進むべき道である場合、監視可能なリクエストオブジェクトの代わりに、同じライブラリからfromPromiseも調べます。古さをチェックするために開始時間を追跡しているため、わかりません。他の誰かがそれに出くわしていない場合に備えて、ここにリンクします:)