Einfaches Verständnis der Instanzattribute vm.$els in vue

Was genau ist das Vue-Instanzattribut vm.$els? Worauf sollten wir achten? Bitte lesen Sie diesen Artikel für Details.

Kein Ausdruck erforderlich

Parameter: id (erforderlich)

Verwendung:

Registrieren Sie einen Index für das DOM-Element, um die Übergabe von $els der Instanz zu erleichtern Es gehört dazu, auf dieses Element zuzugreifen.

Hinweis:

Da bei HTML die Groß-/Kleinschreibung nicht beachtet wird, werden CamelCase-Namen wie v-el:someEl ausschließlich in Kleinbuchstaben umgewandelt. This.$els.someEl kann mit v-el:some-el gesetzt werden.

Mein Verständnis: $els ähnelt der Funktion von document.querySelector('.class') und kann das angegebene dom-Element abrufen.

Beispiel:

69c326b7a47093682eca9dea67f4e56d16b28748ea4df4d9c2150843fecfba68

var _dom = this.$els.maincontainer

Hinweis : Beim Abrufen des Dom-Elements wird der Camel-Case-Name nicht erkannt. Der gebundene Wert lautet jedoch „mainContainer“. Beim Abrufen des Dom-Elements können Sie jedoch nur „maincontainer“ schreiben >

HTML-Code:

 <input type="text" class=&#39;name-input&#39; placeholder=&#39;请填写项目名称&#39; v-on:keyup.enter=&#39;saveProjectFun&#39; v-el:addProject>

js-Code:

//当用户按回车后，保存添加的项目
 saveProjectFun:function(){
 var obj={}
 obj.success=false;
 let name=this.$els.addproject.value;
 obj.projectName=name.replace(/\s+/g,""); 
 this.projectData.push(obj);
 this.addp=true;
 }

Tatsächlich ist this.$els.addproject.value äquivalent zu: document.querySelector('.name -input').value