vue.js中ref及$refs的应用办法解析

发布时间: 2019-10-08 14:29:54 来源: 互联网 栏目: JavaScript 点击:

这篇文章重要简介了vue.js中ref及$refs的应用办法解析,文中经过过程示例代码简介的异常详细,对大年夜家的进修或许任务具有必定的参考进修价值,须要的同伙可以参考下

关于ref和$refs的用法及讲解,vue.js中文社区( https://cn.vuejs.org/v2/api/#ref )是这么讲解的:

ref 被用来给元素或子组件注册援用信息,援用信息将会注册在父组件的 $refs 对象上。

假设在浅显的 DOM 元素上应用,援用指向的就是 DOM 元素;假设用在子组件上,援用就指向组件;

vue.js中文社区文档上的解释曾经就比较浅显易懂了,其实我们可以这么懂得,ref和$refs其实就是用来获得/操作DOM元素的;类似于jquey中的$(".xxx");

那么我们若何应用ref和$refs呢?

ref可以直接加在HTML标签上,作为一个属性存在于HTML标签中,如图

<input title="手机号" name="mobile" ref="mobile" placeholder="手机号" type="tel" is-type="china-mobile" required :min="11" :max="11"></input>

如许,我们就是给input输入框元素注册了援用信息,那么我们若何获得这个DOM元素呢?

异样,vue.js也给我们供给了特定的办法:

this.$refs.mobile  

下面图片就是我们this.$refs.mobile的输入成果 ,vue.js供给的获得DOM元素的办法确切照样很便利呢,欲望我的博客可以或许赞助您更好的懂得vue语法的应用。

以上就是本文的全部内容,欲望对大年夜家的进修有所赞助,也欲望大年夜家多多支撑我们。

本文标题: vue.js中ref及$refs的应用办法解析
本文地址: http://yourctp.com/wangluo/javascript/277861.html

假设认为本文对您有所赞助请赞助本站

付出宝扫一扫赞助微信扫一扫赞助

  • 付出宝扫一扫赞助
  • 微信扫一扫赞助
  • 付出宝先领红包再赞助
    声明:凡注明"本站原创"的一切文字图片等材料,版权均属编程客栈一切,迎接转载,但务请注明出处。
    老手入门js闭包进修过程解析简单完成撙节函数和防抖函数过程解析
    Top