(一)父组件向子组件传值==props
1.在父组件中使用子组件的地方绑定数据
<children :message="message"></children>2.子组件使用props接收父组件传过来的数据
props:{
message:String
}
3.示例:
(二)子组件向父组件传值==$emit,也可以用来调用父组件中的方法
1.子组件直接使用$emit将内部数据传递给父组件
this.$emit("childByValue",this.childValue); 2.父组件中接收数据
<template>
<child @childByVlaue="childByVlaue"></dhild>
</template>
methods:{
childByValue:function(childValue){
this.name=childValue;
}
}
(三)可以通过$parent和$children获取父子组件参数
$children[i].params
this.$parent.params
1.在state里定义数据和属性
state: {
userName: '',
},
2.在mutation里定义函数
mutations: {
setUserName(state, name) {
state.userName = name
},
},
3.设置值
this.$store.comit('setUserName',params) 4.获取值
this.$store.state.user.userName
(五)父组件调用子组件的方法===ref
1.子组件的方法
methods:{
childMethod(){
alert("我是子组件的方法");
}
} 2.父组件调用子组件的方法
<template>
<child ref="child"></child>
<div @click="parentMethod"></div>
</template>
methods:{
parentMethod(){
this.$refs.child.childMethod();
}
}
| 修改日期 | 修改人 | 备注 |
| 2020-02-28 14:57:27[当前版本] | 陈婉 | 格式调整 |
| 2020-02-28 14:57:01 | 陈婉 | 格式调整 |
| 2020-02-28 14:56:25 | 陈婉 | 格式调整 |
| 2020-02-28 14:54:39 | 陈婉 | 格式调整 |
| 附件类型 |
|
|
|
|
||