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代码:
<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)的更多相关文章
- Vue实例属性/方法/生命周期
一 实例属性 var app = new Vue(); app.$el ===>返回当前挂在DOM对象. app.$data ===>返回当前实例data里面的数据 app.$option ...
- vue实例属性之el,template,render
一.el,template,render属性优先性当Vue选项对象中有render渲染函数时,Vue构造函数将直接使用渲染函数渲染DOM树,当选项对象中没有render渲染函数时,Vue构造函数首先通 ...
- vue实例属性之methods和computed
我们可以把同一函数放在methods或者computed中,区别在于computed有缓存,计算属性只有在它的相关依赖发生改变时才会重新求值,即数据改变才会执行函数.而methods每当触发重新渲染时 ...
- vue实例属性之el,template,render--(转载)
转载链接:https://www.cnblogs.com/camille666/p/vue_instance_prop_el_template_render.html 一.el,template,re ...
- es6下 vue实例属性template不能使用
esm模式下 不能使用template,需要引入非esm的vue.js,查看vue源码的包的dist目录下 文件标有esm是支持ems,没有标记,就是不支持(这个知识,怎么说了,应该属于webpack ...
- vue实例属性的方法
1.$mount() 手动设置挂载点 eg:vm.$mount("#app") 2.$destroy() 销毁 eg:vm.$destroy(); 3.$forceUp ...
- Vue基础进阶 之 常用的实例属性
Vue实例属性: vue实例直接调用的属性: 常用的实例属性: vm.$data:获取属性: vm.$el:获取实例挂载的元素: vm.$options:获取自定义选项/属性: vm.$refs:获取 ...
- Vue_(组件)实例属性
Vue实例属性与方法中文文档 传送门 Vue实例属性:vue实例直接调用的属性 Learn 一.vm.$data:获取属性 二.vm.$el:获取实例挂载的元素 三.vm.$options:获取自 ...
- 简述Vue的实例属性、实例方法
1.实例属性 组件树访问 $parent -----> 用来访问当前组件实例的父实例: $root -----> 用来访问当前组件树的根实例,如果当前组件没有父实例,则$root表示当前组 ...
随机推荐
- var a=b=c=1; 和 var a=1, b=2, c=3; 的区别。
function test(){ var a=b=c=1; var a=1, b=2,c=3; } 1中b\c 为全局变量, a为私量 2中a\b\c为私量
- [RxJava^Android]项目经验分享 --- 失败重试
简单介绍一下业务逻辑:获取字符串,如果获取失败进行10次重试,超出10次未成功视为失败. 模拟获取字符串场景 代码块 class MsgTool { int count; String getMsg( ...
- BZOJ2109: [Noi2010]Plane 航空管制
Description 世博期间,上海的航空客运量大大超过了平时,随之而来的航空管制也频频 发生.最近,小X就因为航空管制,连续两次在机场被延误超过了两小时.对此, 小X表示很不满意. 在这次来烟台的 ...
- python面试总结
1.python的优势 1.1 python是一门胶水语言,能够结合各种语言 1.2 python是支持面向对象编程 1.3 python是完全开放源代码,有大量的技术支持文档, 1.4 可移植,py ...
- VS2010 ERROR:c1xx fatal error c1083
在VS2010中新建文件夹,然后在文件夹内新建文件polling.cpp,可是在项目中不现实该cpp文件,所以就在在硬盘上将该文件删除,编译报错. >c1xx : fatal error C10 ...
- [Android] 多重使用Fragment 中的onFragmentInteraction
新建的一个Fragment,被一个Activity使用,那么这个Activity需要继承一个接口: public class MainActivity extends Activity impleme ...
- java-如何用eclipse打包jar
Eclipse通过导出的方式(右键单击项目,之后选择Export)打包java类文件生成jar包. 方法一:(在项目工程没有引用外部jar包时,直接导出) 选中工程---->右键,Export. ...
- Ubuntu中的快捷键
Ubuntu中的许多操作在终端(Terminal)中十分的快捷,记住一些快捷键的操作更得心应手. 在Ubuntu中打开终端的快捷键是Ctrl+Alt+T.其他的一些常用的快捷键如下: 快捷键 功能 T ...
- 数据库(SQL Server)管理数据库表~新奇之处
说到“数据库”,我总有一种莫名的感觉,在刚刚接触到的数据库中就让我似懂非懂渡过着,于是思考着.于是在冷静的时空中让我回想到了很多的知识,不知你们是怎样过来的,真心希望我的这篇数据库总结能够让我们都有一 ...
- 奇怪的UnexpectedRollbackException异常
今天在使用一个原来常用的功能的时候,突然发现在某些场景下会报异常,内容如下: 通过断点调试发现一路都很顺畅,就是在从controller层返回前段的时候会报该异常,没办法,只能通过排除法定位问题,后来 ...