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

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

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

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

子组件

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

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

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

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

组件调用流程

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

猜你喜欢

转载自blog.csdn.net/weixin_40816738/article/details/125596692