获取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. 打造实时数据集成平台——DataPipeline基于Kafka Connect的应用实践

    导读:传统ETL方案让企业难以承受数据集成之重,基于Kafka Connect构建的新型实时数据集成平台被寄予厚望. 在4月21日的Kafka Beijing Meetup第四场活动上,DataPip ...

  2. hbase rowkey 的设计

    什么是rowkey Hbase是一个分布式的.面向列的数据库,它和一般关系型数据库的最大区别是:HBase很适合于存储非结构化的数据,还有就是它基于列的而不是基于行的模式. Hbase是采用K,V存储 ...

  3. WebApi 身份认证解决方案:Basic基础认证

    前言:最近,讨论到数据库安全的问题,于是就引出了WebApi服务没有加任何验证的问题.也就是说,任何人只要知道了接口的url,都能够模拟http请求去访问我们的服务接口,从而去增删改查数据库,这后果想 ...

  4. Python基础之字典

    字典初识 字典的认识 首先,我们来认识一下字典: # 定义一个字典 user_dict = {"name": "zhangsan", "age&quo ...

  5. ubuntu18.04安装spark(伪分布式)

    在安装spark之前,首先需要安装配置Hadoop,这个就不做详细介绍了,可以参看博主的另一篇: https://blog.csdn.net/weixin_42001089/article/detai ...

  6. LOJ #6043. 「雅礼集训 2017 Day7」蛐蛐国的修墙方案

    我可以大喊一声这就是个SB题吗? 首先讲一句如果你像神仙CXR一样精通搜索你就可以得到\(80pts\)(无Subtask)的好成绩 我们考虑挖掘一下题目的性质,首先发现这是一个置换,那么我们发现这的 ...

  7. Python函数的装饰器修复技术(@wraps)

    @wraps 函数的装饰器修复技术,可使被装饰的函数在增加了新功能的前提下,不改变原函数名称,还继续使用原函数的注释内容: 方便了上下文环境中不去更改原来使用的函数地方的函数名: 使用方法 from ...

  8. 三十九、vue中element最原始的分页(未封装的)

    html<el-table ref="scoreUserTable" :data="scorePageUser.slice((currentPage1-1)*pag ...

  9. linux 基本命令2

    linux没有磁盘的概念,这一点不同于windows,Linux所有的文件系统采用树的结构完成(核心本质)树自然有根节点 也就是linux存在一个根目录,用/表示ls 表示查看命令 我们使用 ls / ...

  10. PHP实现部分字符隐藏

    /** * 隐藏部分字符串 * # 此方法多用于手机号码或身份证号.银行卡号的中间部分数字的隐藏 */ function func_substr_replace($str, $replacement ...