Zum Hauptinhalt springen

insert-token

Beschreibung

Wird ausgelöst, nachdem der Benutzer ein Vorschlagelement ausgewählt hat und RichText es als Token einfügt

Das insert-token-Event wird ausgelöst, nachdem der Benutzer ein Element aus einem Trigger-Dropdown auswählt (Erwähnungen, Tags oder einen benutzerdefinierten Trigger, den Sie über die Eigenschaft triggers eingerichtet haben).

Verwendung

"insert-token": ({
data: {
id?: string | number,
label?: string,
url?: string,
// ...beliebige benutzerdefinierte Felder aus der Datenquelle des Triggers
},
trigger: string,
showTrigger?: boolean,
action?: (item) => void
}) => boolean | void;

Parameter

Der Callback des insert-token-Events erhält ein Objekt mit folgenden Feldern:

  • data - das ausgewählte Vorschlagelement. Enthält id, label und url des Elements sowie alle benutzerdefinierten Felder, die Sie der data-Quelle des Triggers hinzugefügt haben
  • trigger - das Trigger-Zeichen, das das Dropdown geöffnet hat (zum Beispiel "@" oder "#")
  • showTrigger - wenn false, fügt RichText nur label ein; andernfalls zeigt das Widget auch das Trigger-Zeichen an (Standard)
  • action - eine benutzerdefinierte Aktion, die für den passenden Trigger definiert wurde. Wenn gesetzt, hat dieser Parameter Vorrang vor der Token-Einfügung: RichText entfernt den eingegebenen Text (das Trigger-Zeichen und die Abfrage) und ruft stattdessen action(data) auf, anstatt ein Token einzufügen. Der Parameter showTrigger hat in diesem Fall keine Wirkung
Info

Verwenden Sie zur Verarbeitung interner Events die Event-Bus-Methoden.

Beispiel

// RichText initialisieren
const editor = new richtext.Richtext("#root", {
// Konfigurationseigenschaften
});
// das "insert-token"-Event abonnieren
editor.api.on("insert-token", ({ data, trigger, showTrigger }) => {
console.log(`Inserted ${trigger}${data.label} (id: ${data.id})`);
});

Änderungsprotokoll: Das Event wurde in v2.1 hinzugefügt

Verwandtes Beispiel: RichText. Erwähnungen, Tags und asynchrone Suche

Verwandte Artikel: Erwähnungen und Tags