博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
VUE父子组件传值问题
阅读量:4947 次
发布时间:2019-06-11

本文共 670 字,大约阅读时间需要 2 分钟。

一.父组件向子组件传递数据

组件实例的作用域是孤立的。这意味着不能(也不应该)在子组件的模板内直接引用父组件的数据。要让子组件使用父组件的数据,我们需要通过子组件的props选项。
1.静态props
父组件:子组件
2.动态props(要动态地绑定父组件的数据到子模板的props用 v-bind。每当父组件的数据变化时,该变化也会传导给子组件)
父组件: 
3.单项数据流
prop 是单向绑定的:当父组件的属性变化时,将传导给子组件,但是不会反过来。这是为了防止子组件无意修改了父组件的状态
另外,每次父组件更新时,子组件的所有 prop 都会更新为最新值。这意味着你++不应该在子组件内部改变 prop++ .

使用v-on绑定自定义事件,每个Vue实例都实现了事件接口,即:

使用监听事件
使用触发事件
子组件部分:

###### transferUser 是一个自定义的事件,功能类似于一个中转,this.msg 将通过这个事件传递给父组件

父组件部分:
//在父组件 App.vue 中,声明了一个方法 getMsg,用 transferUser 事件调用 getMsg 方法,获取到从子组件传递过来的参数 msg

使用专门的状态管理模式(vuex)

转载于:https://www.cnblogs.com/huyongyong/p/7079206.html

你可能感兴趣的文章
11个Web设计师必须知道的SEO技巧
查看>>
thinkphp5.0 - nginx 配置
查看>>
【转】基于jquery的无刷新表格分页
查看>>
Jq this的指向问题
查看>>
原型链-面向面试
查看>>
推荐使用MEF降低耦合
查看>>
Spring学习
查看>>
刻意练习
查看>>
A31 APK 精简列表
查看>>
unittest单元测试框架简单说明
查看>>
1392
查看>>
day14 生成器表达式,列表推导式 以及 部分内置函数
查看>>
tensorflow学习之(二)Seesion的两种打开模式
查看>>
HDU 2028 如何计算最小公倍数?
查看>>
NodeJS简介
查看>>
百度地图获坐标拾取
查看>>
原型与继承学习笔记2
查看>>
TYVJ1704 Poj3249 绿豆蛙寻宝
查看>>
Java Base64加密、解密原理Java代码
查看>>
使用WinSW 将 exe 创建成Windows下面 service的方法 (将nginx创建成 services)
查看>>