vuejs动态组件给子组件传递数据

通过子组件定义时候的props可以支持父组件给子组件传递数据,这些定义的props在子组件的标签中使用绑定属性即可,但是如果使用的是<component>动态组件,这个时候就没有显式的子组件标签,要给子组件传递数据需要在<component> 中进行绑定

    <div class="app" id="deviceready">
<component :is="currentView" :user_name.sync="user_name" :DOB.sync="DOB"></component>
</div>

组件的作用于是独立的

组件的作用于是独立的,如果要从跟组件获取数据,那么需要一层层的传递才行,也就是说子组件只能从直接父组件获取数据,如果是根组件的数据,那么父组件就要继续暴露pops从而绑定来自根组件的数据。

vuejs动态组件给子组件传递数据的更多相关文章

  1. Vue父组件向子组件传递一个动态的值,子组件如何保持实时更新实时更新?

    原文:https://blog.csdn.net/zhouweixue_vivi/article/details/78550738 2017年11月16日 14:22:50 zhouweixue_vi ...

  2. Vue父子组件通信(父级向子级传递数据、子级向父级传递数据、Vue父子组件存储到data数据的访问)

    Vue父子组件通信(父级向子级传递数据.子级向父级传递数据.Vue父子组件存储到data数据的访问) 一.父级向子级传递数据[Prop]: ● Prop:子组件在自身标签上,使用自定义的属性来接收外界 ...

  3. React中父组件与子组件之间的数据传递和标准化的思考

    React中父组件与子组件之间的数据传递的的实现大家都可以轻易做到,但对比很多人的实现方法,总是会有或多或少的差异.在一个团队中,这种实现的差异体现了每个人各自的理解的不同,但是反过来思考,一个团队用 ...

  4. Vue父组件向子组件传递方法(自定义方法)并且子组件向父组件传递数据

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. vue父组件与子组件之间的数据传递

    父组件向子组件传递数据 父组件用数据绑定:子组件用props接收 <!-- test-vue-model父组件 --> <template> <div> <m ...

  6. vue单文件组件形成父子(子父)组件之间通信(vue父组件传递数据给子组件,子组件传递数据给父组件)

    看了很多文章,官网文档也有看,对父子组件通信说的不是很明白:决定自己总结一下: vue一般都使用构建工具构建项目:这样每个组件都是单文件组件:而网上很多文章都是script标签方式映入vue,组件通信 ...

  7. vue 父组件动态传值至子组件

    1.进行数据监听,数据每次变化就初始化一次子组件,进行调取达到传递动态数据的目的普通的监听: watch:{ data: function(newValue,oldValue){ doSomeThin ...

  8. 子组件获取父组件数据 propsDown, 父组件获取子组件数据 eventUp

    (一) popsDowm 三种方法获取父组件数据:被动获得(1):主动获取(2). 1.被动获得: 父组件:v-bind: 绑定变量参数和方法参数:子组件:props 接收参数.可以在模板中直接使用也 ...

  9. vue 的父组件和子组件互相获取数据和方法

    父组件主动获取子组件的数据和方法 一.ref(但不能实时更新获取) 1.调用子组件的时候 定义一个ref <child ref="headerChild"></c ...

随机推荐

  1. DOM 事件

    1.注册事件 // 事件处理函数 function handleMouseOver(event) { // process ...... } p.addEventListener("mous ...

  2. [转]linux shell数据重定向(输入重定向与输出重定向)详细分析

      在了解重定向之前,我们先来看看linux 的文件描述符. linux文件描述符:可以理解为linux跟踪打开文件,而分配的一个数字,这个数字有点类似c语言操作文件时候的句柄,通过句柄就可以实现文件 ...

  3. Java数组与vector互转

    Java数组与vector互转 /* Object[] object1 = null ; //数组定义 Vector<Object> object2;//Vector定义 object2 ...

  4. C#is运算符的作用

    is运算符的含义:检查对象是不是给定类型,或者是否可以转换为给定类型,如果是,这个运算符就返回True. is运算符的语法:<operand> is <type> 这个表达式的 ...

  5. javascript基础知识-函数

    1.javascript中函数有两种定义方式: 函数语句定义和表达式定义 //函数有定义 function test(){ console.log("This is a function&q ...

  6. UIAlertController的使用

    在iOS8中,苹果对UIAlertView和UIActionSheet进行了重新的封装,成为适应性更强,灵活性更高的UIAlertController.具体使用方法如下. UIAlertControl ...

  7. vim插件神器spf13在Linux上的安装

    官网给出的安装办法很简单: curl http://j.mp/spf13-vim3 -L -o - | sh 可惜有问题: connection reset by peer 正确的姿势是: curl ...

  8. PYTHON学习之路_PYTHON基础(3)

    学习内容: 1.Python字典 2.Python集合 3.Python字符编码 4.Python文件操作 5.Python实例 一.Python字典 1.定义: dic1={'name':'alex ...

  9. NPIO 导出记录

    http://www.cnblogs.com/qingyuan/archive/2012/11/08/2760034.html http://www.cnblogs.com/gaoshuai/arch ...

  10. css块级元素,内联元素,内联块状元素

    块元素 什么是块级元素?在html中<div><p><h1><form><ul>之类的就是块级元素.设置display:block是就将元素 ...