現在開いているトピックのタグリストを取得するにはどうすればよいですか？

開発
1

こんにちは！

タグ付きトピックにカスタムボタンを追加するテーマコンポーネントを作成しようとしています。たとえば、event-tag というタグが付いたトピックには、カテゴリの隣に Event という名前のボタンが表示され、イベントページにリンクされるようにしたいと考えています。

このガイド: Developing Discourse Themes & Theme Components を通じて、ボタンを追加したい場所（topic-category プラグインのアウトレット）を見つけました。

そして、現在は次のようになっています。

<script type="text/x-handlebars" data-template-name="/connectors/topic-category/foobar2">
    <div style="height: 25px; width: 25px;background: red">
      <a href="<evens_URL>" target="_blank">Link</a>
    </div>
  </script>

それで、質問なのですが、上記のスクリプトがボタンを追加すべきかどうかを確認するために、トピックのタグのリストをどのようにチェックできますか？

2

進捗がありました。

modifyClass を次のように使用すると、次のようになります。

<script type="text/discourse-plugin" version="0.8">
    api.modifyClass("component:topic-category", {
      didInsertElement: function() {
        this._super();
        console.log("Welcome to the topics page!")
      }
    });
    </script>

トピックページにアクセスでき、「ようこそ」という応答を得ることができますが、ボタンをポップアップさせるべきかどうかを確認するために、現在のページのタグをどのように取得できるかはまだわかりません。

3

解決策が見つかりました。

Developing Discourse Themes & Theme Components を繰り返し読んでいたところ、console.log(this) を実行するだけで、タグを含むページ上のすべてのデータが出力されることがわかりました。これで、ページ上のタグデータを取得し、それが設定に含まれているかどうかを確認できると思います。これを完成させて一般公開の準備ができたら、テーマコンポーネントのカテゴリに投稿します。テーマコンポーネントの作成方法を学んでいる他の人がいるかもしれないので、私の発見を共有しておこうと思いました。

4

参考情報ですが、このコンテキストでタグリストを取得するためのコードは次のようになります。

<script type="text/discourse-plugin" version="1.4.0">
    api.modifyClass("component:topic-category", {
      pluginId: "returnTags",
      didInsertElement: function() {
        this._super();
        console.log(this.topic.tags)
      }
    });
</script>

返却されるもの：

image
image210×102 1.7 KB

:information_source: (pluginId は警告を回避するために必要です)