vue 子组件索引 ref

最新推荐文章于 2024-12-29 11:47:05 发布

转载最新推荐文章于 2024-12-29 11:47:05 发布 · 174 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/xiaofenguo/p/6895672.html

文章标签：

#javascript #ViewUI

本文介绍如何在Vue中通过ref属性访问子组件实例。使用ref可以为子组件指定一个ID，在父组件中通过$refs获取这个ID来直接操作子组件。需要注意的是，$refs仅在组件渲染完成后填充，并且是非响应式的。

尽管有props和events，但是有时任然需要在javascript中直接访问子组件。为此可是使用ref为子组件指定一个索引ID.

<div id="parent">
  <user-profile ref="profile"></user-profile>
</div>
var parent = new Vue({ el: '#parent' })
// 访问子组件
var child = parent.$refs.profile
当 ref 和 v-for 一起使用时， ref 是一个数组或对象，包含相应的子组件。

$refs 只在组件渲染完成之后才填充，并且它是非响应式的。它仅仅作为一个直接访问子组件的应急方案---应当避免在模板或者计算属性中使用$refs

转载于:https://www.cnblogs.com/xiaofenguo/p/6895672.html