Ich kann nicht sagen, dass ich eine ideale Lösung gefunden habe, aber ich habe herausgefunden, was für mich das Problem war.
Das Problem ist hier zu finden:
https://github.com/discourse/Discourse-nav-links-component/blob/main/desktop/head_tag.html
Insbesondere dieser Teil:
api.modifyClass("component:navigation-item", {
pluginId: "discourse-nav-links-component",
active: Ember.computed("contentFilterMode", "filterMode", function() {
let contentFilterMode = this.get("content").get("filterMode");
if (window.location.pathname === location) {
return contentFilterMode === filter;
} else {
return this._super(contentFilterMode, this.get("filterMode"));
}
})
});
Es sieht so aus, als würde dies das “active” für jeden Navigationslink setzen. Ehrlich gesagt, die Logik, wie es entscheidet und was all diese Variablen sind, ist mir ziemlich undurchsichtig. Aber das Problem liegt hier:
if (window.location.pathname === location) {
return contentFilterMode === filter;
} else {
return this._super(contentFilterMode, this.get("filterMode"));
}
Für mich prüft dies, ob die Seiten-URL mit dem Standort der Navigationsleisten-URL übereinstimmt, und wenn ja, gibt es das Ergebnis von contentFilterMode === filter zurück, wobei beide Variablen für mich etwas unklar sind. Wenn die Bedingung fehlschlägt, sieht es so aus, als würde es einfach die normale Logik ausführen, ob etwas als aktiv markiert werden soll (deshalb scheinen meine nicht benutzerdefinierten Links einwandfrei zu funktionieren). Das Problem ist, dass, obwohl dieser Code einmal pro Navigationslink korrekt ausgeführt wird, die Variable location immer “categories” zu sein scheint, sodass die if-Anweisung für benutzerdefinierte Links immer falsch ist. Darüber hinaus ist selbst wenn ich die Variable “location” korrigiere, indem ich sie durch this.get("content").href ersetze, der Rückgabewert auch immer falsch, da die Variable filter ebenfalls immer auf “categories” gesetzt ist.
Normalerweise würde ich einen PR machen, um dies zu beheben, aber das eigentliche Grundproblem entzieht sich mir immer noch. Ich habe einen Workaround gefunden, der für mich funktioniert, aber die dokumentierte Funktionalität dieser Komponente leicht verändert, daher würde ich ihn lieber nicht als PR einreichen. Ich denke, es wird auch Randfälle geben, in denen er nicht funktioniert, z. B. wenn Ihre Homepage auf /latest gesetzt ist.
api.modifyClass("component:navigation-item", {
pluginId: "discourse-nav-links-component",
active: Ember.computed("contentFilterMode", "filterMode", function() {
return window.location.pathname.includes(this.get("content").href);
})
});
Grundsätzlich prüft es nur, ob die aktuelle URL die URL der Navigationsleiste als Teilstring enthält. Wenn ja, wird sie hervorgehoben.