外部リンクアイコン

こんにちは :waving_hand:

これは、私のテーマコンポーネントでこれをどのように使用しているかの例です。

私の場合、コンポーネントがCSSを介してアイコンを動的に変更するため、設定を使用しています。これにより、それらの設定を直接ターゲットにすることができます。(リンクにクラスを追加することは、場合によってはあまりうまくいかないことがあります。)


しかし、あなたのコンポーネントの場合は、おそらく次のように現在のホスト名を除外するだけでよいでしょう。

import { apiInitializer } from "discourse/lib/api";

export default apiInitializer((api) => {
  api.decorateCookedElement(
    (element) => {
      const currentHost = window.location.hostname;

      const selector = `a[href*='//']:not([href^='/']):not([href*='${currentHost}'])`;
      
      const links = element.querySelectorAll(selector);

      links.forEach((link) => {
        console.log("外部リンク:", link.href);
      });
    },
    { id: "external-link", onlyStream: true }
  );
});