获取DOM元素,一般用document.querySelector获取这个dom节点,然后在获取input的值

但是用ref绑定之后,就不需要在获取dom节点了,直接在上面的input上绑定input1,然后$refs里面调用即可

this.$refs.input1  这样可以减少获取DOM节点的消耗

<div id="app">
<input type="text" ref="input1"/>
<button @click="add">添加</button>
</div>
new Vue({
el: "#app",
methods:{
add:function(){
//this.$refs.input1 减少获取dom节点的消耗
this.$refs.input1.value ="996";
}
}
})

随机推荐

  1. 【转】Python之道

    作者:Vamei 出处:http://www.cnblogs.com/vamei Python有一个彩蛋,用下面语句调出: import this 该彩蛋的文档记录于PEP 20. 语句执行之后,终端 ...

  2. 利用Navicat高效率postgresql转mysql数据库

    本人很喜欢postgresql数据库,也一直认为postgresql比mysql要更好更强大. 可生态环境太差了,无奈,最近要把一个小站转成mysql数据库. 小站主要表数据110万,pg_dump备 ...

  3. OpenGL实例:几何变换

    OpenGL实例:几何变换 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 更多请查看:计算机图形学 1. 平移 #include <GL/glu ...

  4. CDH集成Kafka,两种方式:离线、在线

    1.离线 先下载相应版本的kafka http://archive.cloudera.com/kafka/parcels/ 然后放置相应目录,如下图: 然后直接添加组件即可 2.在线 配置相应的kaf ...

  5. python接口自动化-post请求3

    一.SSL 证书 https 的请求相对于http安全级别高,需要验证SSL证书import urllib3 使用这个方法就可以了urllib3.disable_warnings() 可忽略警告 二. ...

  6. 2018-2019-2 20175217 实验三《敏捷开发与XP实践》实验报告

    一.实验报告封面 课程:Java程序设计 班级:1752班 姓名:吴一凡 学号:20175217 指导教师:娄嘉鹏 实验日期:2019年4月25日 实验时间:--- 实验序号:实验三 实验名称:敏捷开 ...

  7. Redis详解(五)------ redis的五大数据类型实现原理

    前面两篇博客,第一篇介绍了五大数据类型的基本用法,第二篇介绍了Redis底层的六种数据结构.在Redis中,并没有直接使用这些数据结构来实现键值对数据库,而是基于这些数据结构创建了一个对象系统,这些对 ...

  8. 记录学习antd design pro dva的过程,主要记错, 多图预警,如有理解偏差,忘指出,多谢!

    首要问题: 如何增加菜单项 答案: 在router.config中添加路由,在locales语言国际化增加选项 问题1: 答案1: 问题2: 这个要修改state,正确写法 存在的疑惑:为什么不能直接 ...

  9. flutter Provide 状态管理篇

    Provide是Google官方推出的状态管理模式.官方地址为: https://github.com/google/flutter-provide 现在Flutter的状态管理方案很多,redux. ...

  10. Asp.Net Core中DI的知识总结

    在asp.net core中DI的概念是由这几部分组成的: IServiceCollection,保存IServiceDescriptor实例的列表 IServiceProvider,只有一个方法Ge ...