uni.app 子组件调用父组件的方法并传递数据

技术uni.app 子组件调用父组件的方法并传递数据 uni.app 子组件调用父组件的方法并传递数据$refs子组件templatebutton点击我/button
/template
scripte

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

(0)

相关推荐

  • furniture可数吗,difficulty可数吗?

    技术furniture可数吗,difficulty可数吗?1. 关于是否用作可数名词和是否用复数形式furniture可数吗: (1)
    表示抽象意义的“困难”,是不可数名词,如:
    Bad
    planning
    wil

    生活 2021年10月21日
  • css样式表有哪些特点

    技术css样式表有哪些特点小编给大家分享一下css样式表有哪些特点,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

    攻略 2021年11月18日
  • 微信能传多大的视频,微信朋友圈能发多大的视频

    技术微信能传多大的视频,微信朋友圈能发多大的视频在iOS系统下能发400KB以内视频微信能传多大的视频,Android系统能发200到300KB之间的视频。 1.使用微信,网络不稳定,流量也受限时不太适合用户发布或者查

    生活 2021年10月20日
  • 学生证有什么用处,国际学生证在巴黎用处大吗

    技术学生证有什么用处,国际学生证在巴黎用处大吗1. 著名景点基本上都有打折,比如巴黎人游艇,凡尔赛宫,蒙马特小火车等等,如果需要我可以私信您我们巴黎优惠的List清单学生证有什么用处。谢谢回复 2# nelucifer

    生活 2021年10月24日
  • python怎么取固定格式文件

    技术python怎么取固定格式文件python怎么取固定格式文件,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。环境:这几天在使用python开发程序的过程中

    攻略 2021年10月27日
  • excel中Alt键的使用技巧有哪些

    技术excel中Alt键的使用技巧有哪些这篇文章将为大家详细讲解有关excel中Alt键的使用技巧有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。  1.Alt+Enter 强制换

    攻略 2021年10月29日