Wie ändere ich den Link, der mit einer Schaltfläche im Benutzer-Menüfeld verknüpft ist

Entwickler
1

Anstatt dass der hervorgehobene Button auf u/miles/summary verweist, möchte ich, dass er auf u/miles/activity zeigt. Wie kann ich das umsetzen? Ich habe online danach gesucht (es scheint, dass man das data-url-Attribut mit JavaScript ändern muss, aber die einzige Methode, die ich gefunden habe, erfordert zunächst die ID des Elements zu ermitteln, welche dieses Element jedoch nicht besitzt.)

PIC
PIC1920×1080 480 KB

2

Sie müssten das betreffende Widget in einer Theme-Komponente erneut öffnen, ähnlich wie hier:

api.reopenWidget("user-menu-links", {
  profileGlyph() {
    return {
      title: Titles["profile"],
      className: "user-preferences-link menu-link",
      id: QuickAccess.PROFILE,
      icon: "user",
      action: UserMenuAction.QUICK_ACCESS,
      actionParam: QuickAccess.PROFILE,
      data: { url: `${this.attrs.path}/activity` },
      role: "tab",
      tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
    };
  },
})
3

Danke! Das ergibt Sinn, denke ich.
Eine Sache jedoch: Ich füge dies in <head> ein, erhalte aber den Fehler: SyntaxError: unknown: Unexpected token, expected "," (28:6)

<script type="text/discourse-plugin" version="0.8">    
    api.reopenWidget("user-menu-links", {
      profileGlyph() {
        return {
          title: Titles["profile"],
          className: "user-preferences-link menu-link",
          id: QuickAccess.PROFILE,
          icon: "user",
          action: UserMenuAction.QUICK_ACCESS,
          actionParam: QuickAccess.PROFILE,
          data: { url: `${this.attrs.path}/activity` },
          role: "tab",
          tabAttrs: this._tabAttrs(QuickAccess.PROFILE),
        };
      },
    }
</script>
4

Oben fehlte eine schließende Klammer, aktualisiert

6

Kein Fehler mehr, aber… Jetzt öffnet sich das Dropdown-Menü „Benutzer-Menü-Links

7

Was hast du getan, um es zu debuggen?

Ein Blick in die JavaScript-Konsole im Browser ist immer ein guter Anfang.

Wenn du hinschaust, gibt es drei offensichtliche Probleme (letztendlich).

Die Lösung ist in diesem Fall ziemlich einfach: Du musst lediglich die fehlenden Konstanten bereitstellen:

      const UserMenuAction = {
        QUICK_ACCESS: "quickAccess",
      };

      const QuickAccess = {
        BOOKMARKS: "bookmarks",
        MESSAGES: "messages",
        NOTIFICATIONS: "notifications",
        PROFILE: "profile",
      };
      
      const Titles = {
        bookmarks: "user.bookmarks",
        messages: "user.private_messages",
        notifications: "user.notifications",
        profile: "user.preferences",
      };

Sobald du diese (aus dem ursprünglichen Quellcode) hinzufügst, funktioniert es :tada:

(Aber siehe Faizaans Optimierung unten, die diese überflüssig macht – das ist noch besser :))

8

Einfacher ausgedrückt

<script type="text/discourse-plugin" version="0.8">    
api.reopenWidget("user-menu-links", {
  profileGlyph() {
   const glyph = this._super(...arguments);
   glyph['data'] = { url: `${this.attrs.path}/activity` };
   return glyph;
  },
}

Noch nicht getestet :wink:

9

Ja, viel besser und vermeidet die Notwendigkeit von Konstanten – schöne Optimierung! :slight_smile:

10

Tatsächlich können Sie noch einen Schritt weitergehen und das weglassen:

      api.reopenWidget("user-menu-links", {
        profileGlyph() {
         const glyph = this._super();
         glyph['data'] = { url: `${this.attrs.path}/activity` };
         return glyph;
        }
      });

Da keine Argumente vorhanden sind.

11

Danke, Leute! Funktioniert einwandfrei. Ich lerne auch viel über das Bearbeiten von Discourse!