テーマコンポーネントの j/s の実行順序を制御するものは何ですか?

テーマ内に JavaScript を含めています(まだ有名にはなっていませんね ;))。api.decorateCooked(…) を通じて要素を追加することで DOM を変更しています。これにより、さまざまな HTML の head 要素が挿入されます。

また、DiscoTOC のテーマコンポーネントもインストール済みです。

しかし、DiscoTOC が検知して展開する通常の <div data-theme-toc="true"></div> を追加しても、動的に挿入された要素を含む目次は生成されません。

これは単に実行順序の問題ではないかと考えています。つまり、JavaScript がさらに要素を追加する前に DiscoTOC が処理を行ってしまう場合などです。

複数のテーマ JavaScript コードが api.cooked( を呼び出す場合、実行順序を決定する要因は何でしょうか?

「いいね!」 3

バンプ? :slight_smile:

20文字にするための冗談

DiscoTOC は投稿内容のみで動作することに注意してください。投稿の外にそれらの要素を挿入しても、認識されません。

これまでに JavaScript の実行順序を定義する必要はなかったと思います。

「いいね!」 1

はい、投稿内に挿入しています。そのため、実行順序が問題だと疑っています。

何らかのコードが実行順序を決定しています。それが、TOC よりも前にコンポーネントを取得するための重要なポイントです。例えば、コンポーネント名(管理画面のコンポーネントリストに表示される名前)のアルファベット順で並んでいる場合、それに合わせてコンポーネントを命名することで対応できます。

コンポーネントの実行順序は、コンポーネントの名前に基づくものではないと確信しています。デフォルトでは ID に基づいて決定されます。

とはいえ、高度なユースケースではイニシャライザーの順序をカスタマイズすることも可能です。DiscoTOC を名前付きイニシャライザーとして設定し、あなたのコードを DiscoTOC より前に実行できるようにすることはできますが、まず何を実現しようとしているのかを教えていただければ、明確な回答を提供できます。

ここでの変更は、HTTP/AJAX リクエストに基づいたものですね?

「いいね!」 1

はい、AJAX を使用していますが、同期呼び出しです(「同期 AJAX」という矛盾した表現がいつも好きなんです :^))。

次のステップは、適切なコンポーネントを作成することだと感じています。現時点では、単に私のテーマのヘッダーに JavaScript を貼り付けているだけです。そうすれば、適切に選ばれた ID をいじってみることができます。「_foo」や「0-foo」があれば、それで十分かもしれません。

「いいね!」 1

みんなそうですよね :wink:

その通りです。名前付き初期化子や初期化子の順序を使用したい場合は、コンポーネントに /javascript フォルダ内の初期化子が必要です。

でも、ご安心ください。それらすべてお手伝いできます。明日、詳しい回答をお送りします。

「いいね!」 1

しばらく前に、j/sハッキングを適切なテーマコンポーネントにしました。

並び順を、私のコンポーネントがDiscourseの目次より前に実行されるように戻したいと思います。

iirc、テーマコンポーネントはプラグインの後で評価されます。

間違っているかもしれませんが、名前の順序でロードされるため、名前に x- を付けると、特定のテーマコンポーネントが最後に評価されるように過去に役立ちました。

それは問題ありません。DiscoTOC ( https://github.com/discourse/DiscoTOC.git ) コンポーネントと自作コンポーネントの順序を調整しようとしています。

上記他の人の返信では、コンポーネントの 名前 は実行順序に影響しないと示唆されています。aa-mycomponent と x-last-DiscoTOC に名前を変更しましたが、うまくいきませんでした。[DiscoTOC は動的に DOM に追加された見出しを含みません — はい、投稿本文内です]

https://forum.moversmindset.com/t/list-of-movers-mindset-podcast-episodes/1160

@Johani 5月の考えからさらにアイデアはありますか?

うーん…注文の問題だけではないかもしれません。インスペクトをクリックしたところ…HTMLの見出しだと思っていたものが、実際にはclass="d-toc-ignore"を持つDIVタグでした。

もっと深く掘り下げる時間です。私の見出しはどこへ行ったのでしょうか? :slight_smile:

どちらの方法でも、非常に基本的な例で証明できると思います。

2つのシンプルなコンポーネントを作成し、同じものをオーバーライドまたは接続します。おそらく、わずかに異なるシンプルなテンプレートで、アルファベット順で後に来る名前で呼び出し、どちらがテーマをオーバーライドすることになるかを確認します。

モデルのコードでは、名前によって明確に順序付けられています。

「いいね!」 1

名前は実行順序に影響しません。@merefield さん、リンクされた行は管理画面での表示方法に影響しますが、実際の実行には使用されません。

実行順序に関連する行はこちらです。

したがって、データベースの ‘id’ の昇順で実行されます。

Discourse インスタンス間で移植可能な唯一の保証は、テーマ コードが常にテーマ コンポーネント コードの前に実行されるということです。

@Johani さんが上記で言及したように、他のコンポーネントがロードされた後にコードを実行する必要がある場合は、順序指定をサポートする Ember イニシャライザを使用するのが最善でしょう。残念ながら、DiscoTOC が Ember イニシャライザを使用していないように見えるため、この場合はすぐに可能ではありません。DiscoTOC を 複数ファイル JavaScript (したがって Ember イニシャライザ) を使用するように更新することは、間違いなく pr-welcome です。

「いいね!」 3

それは残念です。役に立つかもしれません。いずれにしても、明確にしてくれてありがとう!

「いいね!」 1

(そして、これは Theme component order of precedence に関連しています)

DB ID の優先順位が機能することを再確認させてください。私のニーズは解決されました。皆さん、ありがとうございました!

「いいね!」 2