Tipps zur Verwendung von Vue-Elementen und Nuxt

1. Konvertierung des Übermittlungsformats für die Elementzeitauswahl

Zum Beispiel

Fr., 7. September 2018, 00:00:00 GMT+0800 (chinesische Standardzeit)
Konvertiert in das Format 2020-01-11

Dieser Datensatz fügt dem Datumswähler einen Satz im Wertformat „yyyy-MM-dd“ hinzu.

<el-date-picker type="date" v-model="createdate" @change="formatTime" value-format="yyyy-MM-dd" placeholder="Uhrzeit auswählen"></el-date-picker>

2. Das Problem, dass das Kontrollkästchen bei dynamischer Schleife nicht ausgewählt werden kann

diese.menulist[index].sonList.map((item)=>{
  this.$set(item, 'checked', false); ---Verwenden Sie das Set-Attribut von Vue, um einen Wert zuzuweisen})

3.el-form dynamische Formularüberprüfung (v-if, v-show Ursache für fehlgeschlagenen Überprüfungsfehler)

Bei der Verwendung von v-if oder v-show zum Steuern der Anzeige und des Ausblendens von El-Form-Elementen tritt ein Validierungsfehler auf.

Wenn v-if:element verwendet wird, um Validierungsregeln an Unterkomponenten mit Prop-Attributen im Formular zu binden, wird dies im gemounteten Vue-Deklarationszyklus abgeschlossen. Die von v-if zum Umschalten verwendeten Elemente werden zerstört, was dazu führt, dass die Formularelemente in v-if während der Bereitstellungsphase nicht gerendert werden. Daher sind die Regeln nicht

Es besteht Bindung. Bei der Initialisierung werden Regeln, die die Anzeigebedingungen nicht erfüllen, nicht generiert, was zu einem nachfolgenden Umschalten der Bedingungen führt und die Überprüfung des angezeigten Eingabefelds nicht wirksam wird. Verwenden Sie v-show: Bei der Initialisierung werden alle Regeln generiert und die Regelüberprüfung wird durchgeführt, auch wenn sie ausgeblendet sind.

Lösung (1): Verwenden Sie zur Überprüfung v-if. Konfigurieren Sie nach jedem v-if einen anderen Schlüsselwert.

(2) Benutzerdefinierte Validierungsregeln. Wenn Sie es selbst machen möchten, können Sie die Validierung selbst anpassen.

4. So fügen Sie Devtools zu nuxt hinzu

Folgendes muss zu nuxt.config.js hinzugefügt werden:

Ansicht: {
 Konfiguration: {
  ProduktionsTipp: false,
  devtools: wahr
 }
}

Oben finden Sie ausführliche Informationen zu Verwendungstipps für Vue-Elemente und Nuxt. Weitere Informationen zu Vue-Elementen und Nuxt finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!