uni.app子组件调用父组件的方法并传递数据
$refs
子组件
模板
按钮点击我/按钮
/模板
脚本
导出默认值{
methods: {
发出事件(消息){ 0
console.log(‘接收的数据-(消息)//接收的数据-我是父组件中的数据
}
}
}
/script
父组件
模板
差异
child-a ref=’child’/child-a
！-用裁判员给子组件起个名字-
按钮@click=’getMyEvent ‘点击父组件/按钮
/div
/模板
脚本
从””导入儿童a ./components/child.vue ‘
导出默认值{
组件： {
儿童a
},
数据(){ 0
返回{
msg: ‘我是父组件中的数据’
}
},
methods: {
getMyEvent(){ 0
这个参考文献。孩子。发出事件(这。味精)；
//调用子组件的方法孩子是上边裁判员起的名字，emitEvent是子组件的方法。
}
}
}
/script
$emit
子组件
模板
按钮@click=’emitEvent ‘点击我/按钮
/模板
脚本
导出默认值{
数据(){ 0
返回{
msg: ‘我是子组件中的数据’
}
},
methods: {
发出事件(){ 0
这个$emit(‘my-event ‘，this.msg)
//通过按钮的点击事件触发方法，然后用$emit触发一个我的活动的自定义方法，传递这个。味精数据。
}
}
}
/script
父组件
模板
差异
child-a @ my-event=’ getMyEvent ‘/child-a
！-父组件中通过监测我的活动事件执行一个方法，然后取到子组件中传递过来的值-
/div
/模板
脚本
从””导入儿童a ./components/child.vue ‘
导出默认值{
组件： {
儿童a
},
methods: {
getMyEvent(msg){ 0
console.log(‘接收的数据-(消息)//接收的数据-我是子组件中的数据
}
}
}
/script
第三种是父组件把方法传入子组件中，在子组件里直接调用这个方法
子组件
模板
差异
按钮@click=’childMethod()’点击/按钮
/div
/模板
脚本
导出默认值{
props: {
父方法： {
类型：功能，
默认值： null
}
},
methods: {
子方法(){ 0
如果(这个。父方法){ 0
这个。父方法();
}
}
}
};
/script
父组件
模板
差异
子项：父方法=’父方法’/子项
/div
/模板
脚本
从” ~/组件/坝/子”导入子项；
导出默认值{
组件： {
儿童
},
methods: {
父方法(){ 0
console.log(‘测试’);
}
}
};
/script
具体方法查看：
https://www.cnblogs.com/hanli-you/p/8011719.html
https://www.cnblogs.com/jin-zhe/p/9523782.html
内容来源网络，如有侵权，联系删除，本文地址：https://www.230890.com/zhan/116863.html