カスタムヘッダーアイコン更新：URL経由でPost Dataを投稿

開発
4

ユーザー名を含む外部URLへのリダイレクトです。

新しいAPIを使用した基本的な例を次に示します。

import { apiInitializer } from "discourse/lib/api";
import DButton from "discourse/components/d-button";

export default apiInitializer("1.8.0", (api) => {
  const currentUser = api.getCurrentUser();

  if (!currentUser) {
    return;
  }

  const url =
    "https://example.com/?u=" + encodeURIComponent(currentUser.username);

  const iconComponent = `
    <li class="calculator">
      <DButton
        @href={{url}}
        @icon="calculator"
        class="icon btn-flat"
        title="Calculator"
        target="_blank"
      />
    </li>`;

  api.headerIcons.add("calculator", iconComponent, { before: "search" });
});
  • calculator は一意の名前です。
  • iconComponent は、ここで見られるインラインのGlimmer <template> を参照しますが、components ディレクトリで作成したGlimmerクラスコンポーネントを参照することもできます。
  • before または after の後にヘッダーアイコンの一意の名前を指定することで、アイコンの配置場所を選択できます。

NVIDIA_Share_rvsjetCtUy

ご自由に変更してください！

注意：

  • Glimmer <template> 構文はUIでは機能しません。
  • 別個のファイルを持つテーマコンポーネントを作成する必要があります。TCをすばやく生成するには、Discourse CLI を使用し、コードエディタで簡単に開発できます。強くお勧めします。
  • GitHubのテンプレートも使用できます: GitHub - discourse/discourse-theme-skeleton: Template for Discourse themes.
  • Glimmerコンポーネントを使用するには、ファイル拡張子を .gjs にする必要があります。

さらにヘルプが必要な場合はお知らせください！

「いいね！」 3