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:) 的形式, 把 需要传递给 子组件的 ...
随机推荐
- docker容器的导入导出
导出容器docker export 导出容器快照到本地文件$ sudo docker ps -aCONTAINER ID IMAGE COMMAND ...
- vue.js基础知识总结
初始化一个项目 npm init -y 安装一些依赖 npm install 名称 --save 例如 npm install vue axios bootstrap --save --save 表示 ...
- 使用Sencha Architect开发Sencha Touch应用的整理
官网:http://www.sencha.com/ 其实官网上的文档都很清楚了,不过整理一下总比较好 第一步,软件准备 注: 以下软件的安装本着这样两条原则 一是不要安装在中文目录下 二是不要安装在带 ...
- ES6__字符串、数组、对象的扩展
/** * 字符串的扩展 */ // 模板字符串 tab上面的反向符号 // 添加${} // let flag = true; // // let html = `<ul> // < ...
- 转 Python 字符串操作(string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等)
转自: http://www.cnblogs.com/huangcong/archive/2011/08/29/2158268.html 黄聪:Python 字符串操作(string替换.删除.截取. ...
- vagrant的学习 之 Yii2
vagrant的学习 之 Yii2 本文根据慕课网的视频教程练习,感谢慕课网! 慕课视频学习地址:https://www.imooc.com/video/14218. 慕课的参考文档地址:https: ...
- Java fail-fast 与 fail-safe 机制对比
关于fail-fast参考这篇文章: 从 modCount 看 java集合 fail-fast 机制 一.fail-safe概述以及与fail-fast区别 首先 fail-safe 并不属于J ...
- 【TFS 2017 CI/CD系列 - 02】-- Build篇
.创建Build 登录TFS,在现有的[Projects]中选择一个需要要创建Build的Project,点击[Build & Release]跳转页面 在新页面中选择[Builds]选项卡, ...
- guava缓存设置return null一直报错空指针
guava缓存设置return null一直报错空指针 因为缓存不允许返回为空
- 一起talk C栗子吧(第一百回:C语言实例--使用信号量进行进程间同步与相互排斥一)
各位看官们.大家好,上一回中咱们说的是进程间同步与相互排斥的样例,这一回咱们说的样例是:使用信号量进行进程间同步与相互排斥. 闲话休提,言归正转.让我们一起talk C栗子吧! 看官们,信号量是由著名 ...