使用 ref 为子组件指定一个引用 ID。例如:

<div id="parent">
<user-profile ref="profile"></user-profile>
</div>

引用子组件:

var parent = new Vue({ el: '#parent' })
// 访问子组件实例
var child = parent.$refs.profile

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

此方案可以用来父子通信

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

  1. vue父组件引用子组件方法显示undefined问题原因及解决方法

    关于vue父组件引用子组件问题 1.首先导入子组件并且在components中定义子组件 2.引用子组件,并定义ref,ref定义的名称用于 this.$refs所调用的名称 3.调用子组件的方法 ( ...

  2. vue.js 组件引用之初级 之二

    1. template 标签也可以实现替换,这样可以省去script标签了 <!DOCTYPE html> <html lang="en"> <hea ...

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

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

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

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

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

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

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

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

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

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

  8. vue父组件引用多个相同的子组件传值

    没有什么问题是for 解决不了的,我一直深信这句话,当然这句话也是我说的 父组件引用多个相同的子组件传值问题 (这种情况很少遇到) 1 <template> 2 <div> 3 ...

  9. vue.js 组件引用之初级

    1. 构造组件,及组件引用:1.1 构造一个组件,1.2 注册一个组件,1.3  实例化Vue()即引用Vue() <!DOCTYPE html> <html lang=" ...

随机推荐

  1. MVC使用Entity Framework Code First,用漂亮表格显示1对多关系

    部门和职员是1对多关系.用一个表格列出所有部门,并且在每行显示该部门下的所有职员名称.如下: 部门和职员的Model: using System.Collections.Generic; namesp ...

  2. java转换emoji表情

    /** * @Description 将字符串中的emoji表情转换成可以在utf-8字符集数据库中保存的格式(表情占4个字节,需要utf8mb4字符集) * @param str * 待转换字符串 ...

  3. 转 UITextField

    //初始化textfield并设置位置及大小 UITextField *text = [[UITextField alloc]initWithFrame:CGRectMake(20, 20, 130, ...

  4. Unity中一键创建常用文件夹

    Unity中一键创建常用文件夹 说明 项目测试版本Unity5.3. 这个一个小工具:功能非常简单,就是一键给新建工程添加所有文件夹.到此结束. 但是具体咋操作呢? 与把大象装进冰箱一样,三步,下载代 ...

  5. 安装程序不能验证Update.inf文件的完整性,请确定加密服务正在此计算机上执行

    近期安装Microsoft .NET Framework 4(独立安装程序)时,提示"安装程序不能验证Update.inf文件的完整性,请确定加密服务正在此计算机上执行" 没法放狗 ...

  6. apt-get无法下载,一些网址Not Found 404

    apt-get无法下载,网址报 Not Found 404,原因是apt软件下载源有问题. 1.将/etc/apt/source.list里的内容替换. 在其他能够下载apt的ubuntu机器中拷贝过 ...

  7. Struts2 无后缀action请求

    如果将Struts2的filter-mapping配置成 <filter-mapping> <filter-name>struts2</filter-name> & ...

  8. Common Internet File System

    CIFS (Common Internet File System) is a protocol that gained popularity around the year 2000, as ven ...

  9. 混沌数学之CircuitChaotic(二维离散电路混沌系统)

    相关软件参见:混沌数学之离散点集图形DEMO 相关代码: // http://wenku.baidu.com/link?url=yg_gE7LUXCg2mXRp-ZZdfRXXIkcNj8YOhvN7 ...

  10. 血淋淋的事实告诉你:你为什么不应该在JS文件中保存敏感信息

    在JavaScript文件中存储敏感数据,不仅是一种错误的实践方式,而且还是一种非常危险的行为,长期以来大家都知道这一点. 而原因也非常简单,我们可以假设你为你的用户动态生成了一个包含API密钥的Ja ...