vue 子组件 索引 ref
尽管有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的更多相关文章
- vue子组件通知父组件使用方法
vue子组件通知父组件使用方法 <template> <mt-field placeholder="验证码" v-model="getverifycod ...
- Vue 子组件向父组件传参
直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...
- Vue子组件调用父组件的方法
Vue子组件调用父组件的方法 Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...
- Vue 子组件调用父组件 $emit
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- Vue子组件传递数据给父组件
子组件通过this.$emit(event,data)传递数据到父组件 以下是例子: father.vue 父组件 <template> <div> <child @ne ...
- Vue 子组件调用父组件方法
父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...
- vue 子组件引用
使用 ref 为子组件指定一个引用 ID.例如: <div id="parent"> <user-profile ref="profile"& ...
- Vue 子组件接收父组件的值
1.父组件 <template> <div id="rightmenu8"> <rightmenu7 ref="rightmenu7&quo ...
- vue-父子组件和ref
父组件向子组件传值 <div id="app"> <!-- 父组件,可以在引用子组件的时候, 通过 属性绑定(v-bind:) 的形式, 把 需要传递给 子组件的 ...
随机推荐
- [bzoj1787][Ahoi2008]Meet 紧急集合(lca)
传送门 可以看出,三个点两两之间的lca会有一对相同,而另一个lca就是聚集点. 然后搞搞就可以求出距离了. ——代码 #include <cstdio> #include <cst ...
- Android应用的权限配置和权限列表
权限配置写在Mainifest.xml文件中: <?xml version="1.0" encoding="utf-8"?> <manifes ...
- 【HDOJ6298】Maximum Multiple(数论)
题意:给定n,求x,y,z三个整数,使得x|n,y|n,z|n,且xyz最小 n<=1e6 思路: 不定方程1/x+1/y+1/z=1 只有(2,3,6)(2,4,4) (3,3,3)三组正整数 ...
- ASP.NET程序开发中经典常用的三十三种代码实例[确实有用]
原文发布时间为:2008-11-10 -- 来源于本人的百度文章 [由搬家工具导入] ASP.NET程序开发中经典常用的三十三种代码实例:1. 打开新的窗口并传送参数: 传送参数:response.w ...
- IP聚合 ---百度之星(与运算)
Problem Description 当今世界,网络已经无处不在了,小度熊由于犯了错误,当上了度度公司的网络管理员,他手上有大量的 IP列表,小度熊想知道在某个固定的子网掩码下,有多少个网络地址.网 ...
- Spring中实现自定义事件
原理: 通过扩展ApplicationEvent,创建一个事件类CustomEvent.这个类必须定义一个默认的构造函数,它应该从ApplicationEvent类中继承的构造函数. 一旦定义事件类, ...
- [Unit Testing] Mock an HTTP request using Nock while unit testing
When testing functions that make HTTP requests, it's not preferable for those requests to actually r ...
- 配置activeMQ
一.加入以下的库 并配置好路径 ws2_32.lib;Mswsock.lib;cppunit.lib;libapr-1.lib;libapriconv-1.lib;libaprutil-1.lib;l ...
- Android中的图片查看器
本案例,使用Eclipse来开发Android2.1版本号的图片查看器. 1)首先,打开Eclipse.新建一个Android2.1版本号的项目ShowTu,打开res/values中文件夹下的str ...
- poj 1840 哈希
Eqs Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 14093 Accepted: 6927 Description ...