码迷,mamicode.com
首页 > 其他好文 > 详细

vue实例属性(vm.$els)

时间:2016-06-03 18:44:59      阅读:259      评论:0      收藏:0      [点我收藏+]

标签:

  • 不需要表达式

  • 参数: 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代码:

      <input type="text" class=name-input placeholder=请填写项目名称 v-on:keyup.enter=saveProjectFun 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-input‘).value

 

vue实例属性(vm.$els)

标签:

原文地址:http://www.cnblogs.com/yingzi1028/p/5557017.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!