重新认识vue之 ref

supernavy 发布于2019-08-23 11:35 / 2127人阅读

摘要：引用信息将会注册在父组件的对象上。此时对的认识在于，元素属性写了，则可以通过访问到该元素。其实用在不同位置，访问到的东西是不一样的。也就是说如果用在子组件上，我们还可以通过调用子组件方法。比如前提是这个组件有这个方法。

ref

ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。此时对 ref 的认识在于，元素属性写了 refs，则可以通过 this.$refs 访问到该元素。其实ref 用在不同位置，访问到的东西是不一样的。

ref 在子组件上

如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例。
也就是说如果ref 用在子组件上，我们还可以通过 this.$refs.xxx 调用子组件方法。比如 this.$refs.pointdDetailChart(param) ,前提是这个组件有这个方法。

ref 注册时间

因为 ref 本身是作为渲染结果被创建的，在初始渲染的时候你不能访问它们 - 它们还不存在！$refs 也不是响应式的，因此你不应该试图用它在模板中做数据绑定。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97180.html

Reactjs vs. Vuejs

摘要：上图是二月份前端框架排名，位居第一，排名第三。我们认为前端模板和组件代码是紧密相连的。直到最近看了文档，才发现另有蹊跷。欢迎大家关注腾讯云技术社区-segmentfault官方主页，我们将持续在博客园为大家推荐技术精品文章哦~ 纪俊，从事Web前端开发工作，2016年加入腾讯OMG广告平台产品部，喜欢研究前端技术框架。这里要讨论的话题，不是前端框架哪家强，因为在 Vue 官网就已经...

AaronYuan 2019-08-20 16:24 评论0 收藏0
重新认识vue之事件阻止冒泡

摘要：通用解决办法事件冒泡了嘛，那就阻止事件冒泡呗。很完美有没有，这就不用在事件响应逻辑中去处理事件细节了。冒泡的表现近期用vue做了一个需求，大概是同一个区域，点击不同位置有不同的响应函数，还有个总的响应函数，好吧，如下图所示: showImg(https://segmentfault.com/img/remote/1460000015852878?w=1962&h=392); 他们的...

marek 2019-08-23 10:37 评论0 收藏0
Vue全栈开发之百度贴吧

这个百度贴吧的项目是 vue + koa + sequelize 的项目。由于没有百度贴吧API接口，所以自己写了后端项目部分截图（GIF） showImg(https://user-gold-cdn.xitu.io/2019/7/13/16bea513a0805b84?w=480&h=1040&f=gif&s=4456077);showImg(https://user-gold-cdn.xi...

stefanieliang 2019-08-23 18:39 评论0 收藏0
vue的diff算法学习

摘要：源码地址虚拟算法首先要明确一个概念就是的对象是虚拟，更新真实则是算法的结果基类。。。源码地址虚拟dom diff算法首先要明确一个概念就是diff的对象是虚拟dom，更新真实dom则是diff算法的结果 Vnode基类 constructor ( 。。。 ) { this.tag = tag this.data = data this.chil...

MartinHan 2019-08-22 15:51 评论0 收藏0