尽管有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

vue 子组件 索引 ref的更多相关文章

  1. vue子组件通知父组件使用方法

    vue子组件通知父组件使用方法 <template> <mt-field placeholder="验证码" v-model="getverifycod ...

  2. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

  3. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  4. Vue 子组件调用父组件 $emit

    <!DOCTYPE html><html>    <head>        <meta charset="utf-8">      ...

  5. Vue子组件传递数据给父组件

    子组件通过this.$emit(event,data)传递数据到父组件 以下是例子: father.vue 父组件 <template> <div> <child @ne ...

  6. Vue 子组件调用父组件方法

    父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...

  7. vue 子组件引用

    使用 ref 为子组件指定一个引用 ID.例如: <div id="parent"> <user-profile ref="profile"& ...

  8. Vue 子组件接收父组件的值

    1.父组件 <template> <div id="rightmenu8"> <rightmenu7 ref="rightmenu7&quo ...

  9. vue-父子组件和ref

    父组件向子组件传值 <div id="app"> <!-- 父组件,可以在引用子组件的时候, 通过 属性绑定(v-bind:) 的形式, 把 需要传递给 子组件的 ...

随机推荐

  1. BZOJ 1412: [ZJOI2009]狼和羊的故事【网络流】

    Description “狼爱上羊啊爱的疯狂,谁让他们真爱了一场:狼爱上羊啊并不荒唐,他们说有爱就有方向......” Orez听到这首歌,心想:狼和羊如此和谐,为什么不尝试羊狼合养呢?说干就干! O ...

  2. 亚瑟王(bzoj 4008)

    Description 小 K 不慎被 LL 邪教洗脑了,洗脑程度深到他甚至想要从亚瑟王邪教中脱坑. 他决定,在脱坑之前,最后再来打一盘亚瑟王.既然是最后一战,就一定要打得漂 亮.众所周知,亚瑟王是一 ...

  3. Eddy's AC难题--hdu2200(递推)

    Problem Description Eddy是个ACMer,他不仅喜欢做ACM题,而且对于Ranklist中每个人的ac数量也有一定的研究,他在无聊时经常在纸上把Ranklist上每个人的ac题目 ...

  4. Netflix是什么,与Spring Cloud有什么关系

    说明:以下总结的观点不一定准确,但是是最好理解的. 1.首先,Netflix是一家做视频的网站,可以这么说该网站上的美剧应该是最火的. 2.Netflix是一家没有CTO的公司,正是这样的组织架构能使 ...

  5. sql 2005 安装

    http://blog.csdn.net/wochuailimin/article/details/6120462 http://www.cnblogs.com/huangcong/archive/2 ...

  6. Linux 下使用 Sar 简介

    Linux 下使用 Sar 简介 提交 我的留言 加载中 已留言 介绍 Sar 最早是实现在 Salaris Unix 系统里,后来移植到了大部分其他的 Unix 系统(如AIX,HP-UX等).Li ...

  7. Deepin-安装laravel

    首先获取到composer.phar wget https://getcomposer.org/download/1.6.3/composer.phar 下载以后移动到目标区域 sudo mv com ...

  8. OpenJudge百炼习题解答(C++)--题3142:球弹跳高度的计算

    题: 总时间限制:  1000ms  内存限制:  65536kB 描写叙述 一球从某一高度落下(整数,单位米),每次落地后反跳回原来高度的一半.再落下. 编程计算气球在第10次落地时,共经过多少米? ...

  9. hi3531 SDK已编译文件系统制作jffs2文件系统镜像并解决这个问题 .

    一, 安装SDK 1.Hi3531 SDK包位置 在"Hi3531_V100R001***/01.software/board"文件夹下,您能够看到一个 Hi3531_SDK_Vx ...

  10. LoadRunner---http请求中对中文参数的处理

    Loadrunner 做保险承保业务测试 1. 保险正常业务流程:保费计算--->保存--->申请核保--->核保--->缴费(出保单) 问题一描述 保费计算接口中,需要把车牌 ...