组件实例的作用域是孤立的。这意味着不能并且不应该在子组件的模板内直接引用父组件的数据。

　　可以使用 props 把数据传给子组件。

　　　　

　　　　for-child-msg="aaa"  ，

　　　　for-child-msg可以当变量名，''aaa''是要传递给子组件的数据

　　　　子组件props：[for-child-msg]  接受父组件传递过来的变量名

　　　　 {{forChildMsg}}  父组件传递过来的数据

　　

　　

　　

　　　　html:

　　　　

7.Props向子组件传递数据的更多相关文章

  1. vue 父组件通过props向子组件传递数据/方法的方式

    参考网址:https://segmentfault.com/a/1190000010507616 下面栗子中, callback是传递父组件的方法, mutationName是传递父组件的数据, Ap ...

  2. vue单文件组件形成父子（子父）组件之间通信（vue父组件传递数据给子组件，子组件传递数据给父组件）

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

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

    vuejs动态组件给子组件传递数据 通过子组件定义时候的props可以支持父组件给子组件传递数据,这些定义的props在子组件的标签中使用绑定属性即可,但是如果使用的是<component> ...

  4. vue 父向子组件传递数据，子组件向父组件传递数据方式

    父组件向子组件传递数据通过props,子组件引入到父组件中,设置一个值等于父组件的数据,通过:bind将数据传到子组件中,子组件中通过props接收父组件的数据,这样就可以使用父组件的数据了,循环组件 ...

  5. vue 子组件传递数据跟父组件

    子组件 <body> <div v-on:click="test"></div> <script> export default { ...

  6. vue $emit $on 从子组件传递数据给父组件

    原理是: 子组件使用$emit发送数据,父组件使用$on,或者v-on绑定, 来监听子组件发送的数据. 子组件: <button @click="sendChildData" ...

  7. VUE中父组件向子组件传递数据 props使用

    VUE中,子组件是不能直接访问父组件的数据(一般来说,当然如果你要破坏原则也是可以),如下< <body> <div id="fathercomponent" ...

  8. vue——父组件向子组件传递数据

    看例子: //注册一个全局组件,组件标签名为child Vue.component('child', { props: ['msg'], //接收父组件传递的数据 template: '<h3& ...

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

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

随机推荐

  1. php curl采集，服务器gzip压缩返回数据怎么办

    一般服务器不会胡乱返回gzip压缩的数据,一般是客户端请求的头部里包含你浏览器能接受的压缩方式, Accept-Encoding:gzip,deflate,sdch   这里是gzip .deflat ...

  2. 关于spring的简概

    一.Spring入门操作 IOC 创建对象 <bean id="user" class="com.itheima.domain.User">< ...

  3. css圆角不圆和1px方案

    1.圆角不圆 比如需要我们画一个 r 为 5px 的圆,如果我们使用 rem 作为单位,我们很快会发现在一些机型上的图案不圆,会呈现椭圆形.这是由于 rem 转 px 会存在精度丢失问题. 所以这个时 ...

  4. hadoop分布式存储（2）-hadoop的安装

    总共分三步:1.准备linux环境 租用“云主机”,阿里云,unitedStack等,云主机不受本机性能影响(或者直接安转linux操作系统或者虚拟机也行): PuTTy Configuration ...

  5. NET Core中使用Irony

    在.NET Core中使用Irony实现自己的查询语言语法解析器   在之前<在ASP.NET Core中使用Apworks快速开发数据服务>一文的评论部分,.NET大神张善友为我提了个建 ...

  6. [转]eclipse启动tomcat无法访问的解决方法

    这篇文章介绍了eclipse启动tomcat无法访问的解决方法,有需要的朋友可以参考一下 症状: tomcat在eclipse里面能正常启动,而在浏览器中访问http://localhost:8080 ...

  7. Java 多线程概念

    1.为什么要使用多线程: 更多的处理器核心. 更快的响应时间. 更好的变成模型. 2.线程的优先级: 现代操作系统基本采用时分的形式调度运行的线程,操作系统会分出一个个的时间片,线程会分配到若干时间片 ...

  8. Win7环境下配置FTP

    1.打开 控制面板-->程序和功能-->打开或关闭Windows资源,在弹出的窗体里找到 “Internet信息服务”,展开后选择“Ftp服务器",然后点击"确定&qu ...

  9. sql、linq和lambda查询语句比较inner join和group by组合使用及匿名类型的处理

    使用EF自己做的小功能需要遇到inner join和group by组合使用及匿名类型的处理,搜了很多,基本不能满足自己的需要,所以总结了也实现了就自己写出来,已备查看及伙伴查询参考(一般的语句查询就 ...

  10. Java基础：（二）String字符串

    一.String概述 String被声明为final,因为它不可被继承. 内部使用char数组存储数据,该数组被声明为final,这意味着value数组初始化之后就不能再引用其他数组.并且String ...