vue 实例属性 vm.$els 到底是什么?有哪些需要注意的?具体请阅读本文。
不需要表达式
参数: id(必需)
用法:
为 DOM 元素注册一个索引,方便通过所属实例的 $els 访问这个元素。
注意:
因为 html 不区分大小写,camelCase 名字比如 v-el:someEl 将转为全小写。可以用 v-el:some-el 设置 this.$els.someEl。
我的理解:$els 类似于 document.querySelector('.class') 的功能, 可以拿到指定的 dom 元素。
Eg:
<div v-el:mainContainer></div>
var _dom = this.$els.maincontainer
注意:在取该 dom 元素时, 不识别驼峰命名, 如上例, 绑定的值为 mainContainer, 但是在取 dom 的时候只能写 maincontainer, 否则将无法识别.
其实在上一篇文章中我就用到了 vue 的实例属性 vm.$els
HTML 代码:
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-input').value
本文已被整理到了《》,欢迎大家学习阅读。
来源: http://www.jb51.net/article/98798.htm