vue의 인스턴스 속성 vm.$els에 대한 간단한 이해

vue 인스턴스 속성 vm.$els가 정확히 무엇인가요? 우리는 무엇에 주의해야 합니까? 자세한 내용은 이 기사를 읽어보시기 바랍니다.

표현식 필요 없음

매개변수: id(필수)

사용법:

인스턴스의 $els 전달을 용이하게 하기 위해 DOM 요소에 대한 인덱스를 등록합니다. 이 요소에 액세스하는 데 속합니다.

참고:

HTML은 대소문자를 구분하지 않기 때문에 v-el:someEl과 같은 camelCase 이름은 모두 소문자로 변환됩니다. This.$els.someEl은 v-el:some-el로 설정할 수 있습니다.

내가 이해한 바: $els는 document.querySelector('.class')의 기능과 유사하며 지정된 dom 요소를 가져올 수 있습니다.

예:

69c326b7a47093682eca9dea67f4e56d16b28748ea4df4d9c2150843fecfba68

var _dom = this.$els.maincontainer

참고 : dom 요소를 가져올 때 카멜케이스 이름은 인식되지 않습니다. 위의 예와 같이 바인딩된 값은 mainContainer입니다. 그러나 dom 요소를 가져올 때는 maincontainer만 작성할 수 있으며 그렇지 않으면 인식되지 않습니다. >

HTML 코드:

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

js 코드:

//当用户按回车后，保存添加的项目
 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;
 }

사실 this.$els.addproject.value는 document.querySelector('.name)과 동일합니다. -입력').값