Ich werde eine Theme Component auf GitHub erstellen und veröffentlichen, um einen Logout-Button zum oberen Menü hinzuzufügen, wenn mir jemand sagen kann, wie ich den Code von @pfaffman hier aktualisieren kann…
(Im Moment führt das Befolgen dieser Anweisungen und das Aktivieren der Komponente dazu, dass das gesamte obere Menü verschwindet 
)
So ähnlich. Passen Sie es gerne an Ihre Bedürfnisse an.
import DButton from "discourse/components/d-button";
import routeAction from "discourse/helpers/route-action";
import { apiInitializer } from "discourse/lib/api";
export default apiInitializer("1.28.0", (api) => {
if (api.getCurrentUser()) {
api.headerIcons.add(
"logout",
`<template>
<li class="logout">
<DButton
@action={{routeAction "logout"}}
class="btn-flat icon"
@icon="sign-out-alt"
@title="user.log_out"
@label="user.log_out"
/>
</li>
</template>`,
{ before: "auth" }
);
}
});
.d-header-icons .logout {
margin-left: 1em;
button.icon {
width: auto;
padding-left: 0.5em;
padding-right: 0.5em;
svg {
margin-right: 0.2em;
width: 1em;
}
}
}
OK, ich habe es ausgerollt, aber ich würde mich über jedes Feedback freuen, bevor ich es an Meta übermittle…
(Ich habe Carsons https://meta.discourse.org/t/central-theme-header-user-icons/291526/4 als Ausgangspunkt verwendet)
https://github.com/denvergeeks/discourse-header-logout-button
Ich würde nicht empfehlen, ein Widget zu verwenden; es wird schließlich als Teil der Kernmodernisierung verschwinden.
Dasselbe gilt für api.addToHeaderIcons; es ist jetzt zugunsten von api.headerIcons.add veraltet.
Hier sind einige Vorschläge:
Ich ermutige Sie, GitHub - discourse/discourse-theme-skeleton: Template for Discourse themes als Referenz bei der Erstellung einer Theme-Komponente zu verwenden. Es enthält die neuesten Konfigurationsdateien. Es ist hilfreich für das Linting/Prettifying von Code und eine gute Praxis, eine Standardstruktur zu haben.
Bei der Verwendung der \u003ctemplate\u003e-Syntax benennen Sie die Datei mit .gjs (glimmer JS) um; andernfalls funktioniert sie möglicherweise nicht.
In meinem Beispiel könnten Sie die Vorlage in ihre eigene Datei verschieben, zum Beispiel:
/javascripts/discourse/components/logout-header-button.gjs
import DButton from "discourse/components/d-button";
import routeAction from "discourse/helpers/route-action";
const LogoutHeaderButton = \u003ctemplate\u003e
\u003cli class="logout"\u003e
\u003cDButton
@action={{routeAction "logout"}}
class="btn-flat icon"
@icon="sign-out-alt"
@title="user.log_out"
@label="user.log_out"
/\u003e
\u003c/li\u003e
\u003c/template\u003e;
export default LogoutHeaderButton;
Dann importieren Sie im Initializer die Komponente und verwenden sie als Parameter in headerIcons:
import LogoutHeaderButton from "../components/logout-header-button";
export default apiInitializer("1.28.0", (api) =\u003e {
if (api.getCurrentUser()) {
api.headerIcons.add("logout", LogoutHeaderButton, { before: "auth" });
}
});
Lassen Sie mich wissen, wenn Sie Fragen haben. Ich kann später immer noch einen PR erstellen, wenn Sie ein Beispiel benötigen. 
Einfach super. Vielen Dank, dass Sie sich die Zeit genommen haben, mich anzuleiten!
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.