問題タブ [om]

私はClojure/ClojurescriptとOmが初めてで、少し苦労した後、2次元ベクトルからテーブルをレンダリングするこの方法を思いつきました:

これをより簡潔にする方法、または 1 つのコンポーネント関数からテーブル全体を作成する方法についての指針を探しています。

リッチ クライアントの Web サイト デザインに Om を使用することを検討しました。また、core.async を使用するのはこれが初めてです。チュートリアルを読むhttps://github.com/swannodette/om/wiki/Basic-Tutorial削除操作を処理するための core.async チャネルの使用法を見てきました (ハンドラーですべての作業を行うのではなく)。そのアイテムを含むリストを実際に操作したいアイテムレベルにカーソルがあるスコープで削除コールバックが宣言されたため、そのチャネルを削除に使用しただけであるという印象を受けました。

チャネルについてさらに洞察を得るために、Rich Hickey の講演http://www.infoq.com/presentations/clojure-core-asyncを見ました。そこで彼は、チャネルを使用してイベント コールバックからアプリケーション ロジックを取得することがいかに良いアイデアであるかを説明しています。これにより、チュートリアルの削除チャネルの実際の目的は、アプリケーションを構造化する方法を示すことだったのだろうかと疑問に思いました。もしそうなら、

• そのパターンに関連するベスト プラクティスは何ですか?

• あらゆる種類のイベントに対して個別のチャネルを作成する必要がありますか? つまり、コントローラを追加して新しいイベントを作成する場合、アプリケーションの別の場所でオブジェクトをグローバル状態に追加するために使用されるオブジェクト作成用の新しいチャネルも作成しますか?

• アイテムのリストがあり、1 つのアイテムに詳細/簡潔な状態フラグがあるとしましょう。である場合detailed?はtrueより多くの情報を表示し、 である場合detailed?はfalseより少ない情報を表示します。カーソルで使用するオンクリック イベントを関連付けましたom/transact!(グローバル状態オブジェクト内のリスト項目へのビューです)。

これは非常に簡潔なスニペットであり、コールバック イベントを実際のロジックの変更から分離する手段としてチャネルを使用することの全体的な利点は、最初は努力する価値がないように見えますが、より複雑な例の全体的な利点はこれを上回ります。しかし一方で、このような詳細ではないトグル用に追加のチャネルを導入すると、ソース コードにもかなりの負荷がかかるようです。

設計上の問題全体に関するヒントやヒント、またはその他の考えを提供し、それらを展望していただければ幸いです。私はそこで少し途方にくれた気がします。

カーソルから読み取った初期値で入力要素を表示する必要がありますが、ユーザーが新しいテキストを入力したときにカーソルを更新する必要はありません。例えば：

入力要素が自分自身を更新できるようにするために、常に onChange イベントに関数を提供する必要があることがわかりました。少なくとも空の要素です。これはこれを行う適切な方法ですか？どうもありがとう。

:init-state キーワードの値としてマップを渡すことで、コンポーネントの状態を開始できることを理解しています。しかし、たとえばコンポーネントとその子コンポーネントの間で、このマップを :state キーワードの値として渡すことで、同じ状態を共有できるのでしょうか? それですか？ありがとう。

私は Om を学ぼうとしていますが、理解できないものに出くわしました。私はこのコードを期待します

このhtmlになります：

しかし、そうではありません！最初にdiv含まれる Test は表示されません。私は何を誤解していますか？

ソリューションで編集します（FakeRainBrigandによって指摘されました）：

コードを次のように変更します

予想される html になります。

私はこのOM チュートリアルを進めていますが、OM コンポーネントと単純な関数 (特に om/component マクロ) をいつ使用するかが明確ではありません。

チュートリアルには次のように書かれています。

最初の引数は、アプリケーションの状態データとバッキング React コンポーネント (ここでは owner と呼ばれます) を取る関数です。この関数は Om コンポーネントを返す必要があります。つまり、om.core/component マクロが生成するような om/IRender インターフェイスのモデルです。

次のセクションでは、次のリストのレンダリング ループの例を示します。

ここでは基本的に、(仮想) dom を直接返しているだけであり、OM コンポーネントにラップされていません。このマクロは単に IRender 関数を具体化するのに役立ちますが、単純な関数をそのまま使用することもできるようです。ライフサイクル状態を持つ (または所有者が get-props を呼び出す必要がある) OM コンポーネントを具体化しますが、仮想 dom を作成する必要があるだけのコンポーネントの場合は、単純な関数を使用したいと思います (したがって、ビルド/ビルドは必要ありません)。私の仮想DOMを作成するためのすべての機能）。ここで何が欠けていますか？なぜマクロはまだ有用なのですか (そして私にはわかりません)。

レシピを表示する Clojurescript アプリを作成しようとしています。

関連するコードは次のとおりです ( gistとしても入手可能):

私が達成したいこと：

• まず、非同期 http 呼び出しを使用してレシピを取得します。チャネルを返す cljs-http.client を使用しています
• secretary ライブラリを使用してルートを定義します。/random ルートでは、ランダムなレシピを選択したいと考えています。これは、データがフェッチされ、アプリケーション アトムで更新された場合にのみ発生します。

私が今得ているのは、ブラウザの無限ループです。何が起こっていますか？

別のオプションは、最初にデータを取得する必要があるすべてのルートを go ブロックでラップ(<! (load-recipes))し、最初の行に配置することです。

PS：結局

初めてreactに挑戦するので、シンプルなtodoリストアプリを作りたいと思っています。しかし、Enter キーを押してトリガーするたびに、onSubmitと表示されますUncaught Error: Cannot manipulate cursor outside of render phase, only om.core/transact!, om.core/update!, and cljs.core/deref operations allowed。これは非常に良いエラー メッセージだと思いますが、どうすればよいかわかりません。