怎么理解ref=“”

来源:3-11 阅读进度功能实现

qq_梦紫菱_0

2018-09-03 17:11

之前看到的都是在父组件ebook.vue里出现 我理解的是可以直接调用子组件的方法 ,但这个子组件menubar.vue的input里也出现ref 怎么理解呐?

写回答 关注

1回答

  • Sam
    2018-09-03 21:26:01

    你好,ref的官方定义如下:

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

    这里我用通俗地解释一下,比如:我们定义一个dom

    <div class="a" ref="divA"></div>

    如果我们想获取这个div对象,用js写法应该是这样的:

    const div = document.getElementsByClassName('divA')

    用vue可以这样来实现同样的效果:

    const div = this.$refs.divA

    因为这个div使用ref属性进行了注册,所以在Vue实例中,这个div对象会被添加到Vue.$refs这个对象下,所以我们就可以通过

    Vue.$refs.xxx

    来直接获取这个对象了

快速入门Web阅读器开发

带你了解电子书阅读器的工作原理,通过Vue.js快速实现Web阅读器

26396 学习 · 214 问题

查看课程

相似问题