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:) 的形式, 把 需要传递给 子组件的 ...
随机推荐
- CodeForces230A
题目大意: 一个打恐龙的游戏,有初始体力s,和恐龙n只,然后输入n只恐龙的体力xi,和击杀它得到的奖励体力yi,只有自身体力大于恐龙体力时才能进行击杀,击杀恐龙的顺序可以不定 这题运用到了贪心的思想, ...
- [luoguP3068] [USACO13JAN]派对邀请函Party Invitations(stl大乱交)
传送门 记录每一个编号在那些组中,可以用vector,这里选择链式前向星. 每一组用set 将被邀请的放到queue中 #include <set> #include <queue& ...
- ISAPI映射路径错误,导致K3Cloud打不开。
今天一个同事说她的K3Cloud打不开,一看是页面报500错误,具体信息看图片: 问题: ISAPI配置的映射路径错了,多了个反斜线. 解决办法: 在IIS管理器中找到ISAPI筛选器,删除掉就行了.
- CodeForces - 601A The Two Routes
http://codeforces.com/problemset/problem/601/A 这道题没想过来, 有点脑筋急转弯的感觉了 本质上就是找最短路径 但是卡在不能重复走同一个点 ----> ...
- Codeforces 653D Delivery Bears【二分+网络流】
题目链接: http://codeforces.com/problemset/problem/653/D 题意: x个熊拿着相同重量的物品,从1号结点沿着路走到N号结点,结点之间有边相连,保证可以从1 ...
- dtrace
http://blog.csdn.net/lw1a2/article/details/7389323
- iterm2退出时保存会话状态,下次打开恢复
可以保存已经打开的窗口,本机进入的目录 无法保存ssh连接状态,无法保存ipython状态等 设置方法: 1.这里设置为yes,据说,反复修改一次,重启才起作用,实在有问题就试试 2.这里设置一下 3 ...
- 【转】 一张图看懂开源许可协议,开源许可证GPL、BSD、MIT、Mozilla、Apache和LGPL的区别
原文:http://blog.csdn.net/testcs_dn/article/details/38496107 ----------------------------------------- ...
- SpringBoot初始教程之日志处理(二)
SpringBoot初始教程之日志处理(二) 1.介绍 SpringBoot默认是采用logback进行日志处理.Logback是由log4j创始人设计的又一个开源日志组件.Logback是由log4 ...
- Firefox下td用display控制页面导致页面变形
Firefox下table的td元素假设使用了display:'block'会使得table变形.原因是block会将对象强制作为块对象呈递,为对象之后加入新行,所以并不适合td,改成display: ...