关键词搜索

源码搜索 ×
×

uni-app 子组件调用父组件的方法(vue同样适用)

发布2022-07-04浏览6110次

详情内容

一、快速入门
1. 子组件
<view @click='childBackHome'></view>
    2. 父组件

    父组件说明:
    backHome :事件为子组件回调的方法,需要和子组件会调方法一致即可,可以自定义
    back:自定义方法;需要在父组件的 methods: {}方法区中定义back方法,作为回调方法处理

    <dev @backHome='back'></dev>
    
      3. 子组件回调父页面

      子组件

      methods: {
      	childBackHome(){
      		this.$emit("backHome",e);  //backHome父组件的方法,e要传递的参数
      		}
      }
      
        2
      • 3
      • 4
      • 5
      4. 父组件接收回调

      父组件中,子组件回调的方法名

      back(e){
        console.log(e) //e是传过来的参数val
      }
      
        2
      • 3
      5. 组件调用流程

      子组件也可以理解为公共组件,供其他父页面引入,达到公共页面或者逻辑抽取的效果

      组件调用流程

      • 1.父组件引入子组件
      • 2.父组件传参子组件
      • 3.子组件接收参数
      • 4.执行处理
      • 5.处理完成将结果回传父组件
      • 6.父组件接收子组件回传结果
      • 7.父组件继续执行以后的处理

      相关技术文章

      点击QQ咨询
      开通会员
      返回顶部
      ×
      微信扫码支付
      微信扫码支付
      确定支付下载
      请使用微信描二维码支付
      ×

      提示信息

      ×

      选择支付方式

      • 微信支付
      • 支付宝付款
      确定支付下载