Eine kurze Erläuterung der $notify-Punkte des Elements

Meine ursprüngliche Absicht war, die $notify-Benachrichtigung von element-ui in eine Komponente einzubinden. Nach erfolgreicher Anmeldung rufen Sie die Schnittstelle für niedrigen Lagerbestand auf. Wenn der Lagerbestand in der Liste der Schnittstelle größer als 0 ist, zeigen Sie diese Benachrichtigung an und stellen Sie im Text ein Klickereignis bereit.

Daher ist das erste, was mir in den Sinn kommt, das Attribut dangerouslyUseHTMLString zu verwenden, um einen HTML-String einzufügen

Standard exportieren {
    Methoden: {
      öffnen12() {
        dies.$benachrichtigen({
          Titel: „HTML-Ausschnitt“,
          dangerouslyUseHTMLString: true,
          Nachricht: '<strong>Dies ist ein <i id="show">HTML</i>-Snippet</strong>'
        });
      }
    }
  }

Allerdings ist die HTML-Zeichenfolge in der Nachricht tatsächlich von Vue getrennt. Beispielsweise kann die @click-Methode nicht zum Binden des Ereignisses verwendet werden. Daher sollte es mithilfe der DOM-Operation von js gebunden werden.

Zunächst dachte ich daran, es in der montierten Methode der Komponente zu bekommen

document.querySelector('#anzeigen');

Aber was auf diese Weise erhalten wird, ist null, warum?

Beim Mounten wird das DOM in der Komponentenvorlage gemountet. In meiner Komponente gibt es jedoch keine Vorlage. Ich verwende in der Methode nur this.$notify. Nach dem Mounten befindet sich die Benachrichtigung nicht in der App.

role="alert" ist das Benachrichtigungsfeld, daher können wir es nicht als normale Komponente betreiben. Darüber hinaus kann es nach der Montage der Komponente montiert werden, d. h. wenn die Montagemethode verwendet wird, wird nur die Komponente montiert, aber das darin enthaltene Motiv ist möglicherweise nicht vorhanden und daher null.

Wenn Sie JS-Methoden wie Bindungsereignisse hinzufügen möchten, sollten Sie Listener in HTML hinzufügen, aber Sie müssen das Timing verstehen.

Ich verwende hier immer noch nicht „notify“, da „notify“ eine Benachrichtigungsklasse sein sollte, die dazu neigt, Text anzuzeigen, und es für mich möglicherweise etwas unpassend wäre, „notify“ hier zu verwenden.

Dies ist das Ende dieses Artikels über die wichtigsten Punkte des Elements $notify. Weitere Informationen zum Element $notify finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!