使用场景:页面包含吸顶结构时,父组件刷新时需要调用子组件的请求方法
- 子组件创建一个ChildController
export class ChildController {
refreshData = () => {
}
}
- 子组件声明controller属性
private controller: ChildController = new ChildController();
- 子组件添加方法
refreshData = () => {
this.curPage = 1;
this.loadData();
}
- 子组件在
aboutToAppear
方法中赋值
aboutToAppear() {
if (this.controller) { //给controller对应的方法赋值
this.controller.refreshData = this.refreshData;
}
}
- 父组件导入ChildController并声明一个响应式
private childRef = new ChildController();
- 创建子组件时给子组件的controller赋值
子组件({ controller: this.childRef })
- 调用时:
this.childRef.refreshData()
- 踩坑日记:如果子组件是循环创建的(For Each),则第5步需要声明的是响应式数组,第6、7步根据索引赋值调用
- 附父组件调用子组件官方链接
网友评论