钉钉小程序使用getApp实现类型provide inject的功能 应用场景:解决页面同步子组件弹窗的滚动问题
前言:在开发钉钉小程序的时候 组件内部的弹窗滚动会带着视图同步滚动 所以需要在组件内部弹窗显示的时候禁用视图的scroll滚动 由于我组件封装的比较深 不可能逐级传递 dd也么有provide的语法 所以我使用的getApp 完成控制的效果 最终完美运行 觉得有帮助相互关注一下 后续会持续更新钉钉小程序的坑 废话不多说了 直接上代码
//首先在app.js里面定义全局变量App({//存储回调的函数myProvide:null,//存储当前页面的thisthat:null,<!- end->//在page.js 就是要弹窗的时候禁止同步弹窗滚动的页面
Page({data: {/*<scroll-view class="scroll-view"catchscroll="scrollFn"scroll-y="{{isSorll}}" *///控制视图是否滚动 ture 滚动 false 不滚动isSorll:true,},onLoad({ id, recordTypeNo }) {var app = getApp();app.myProvide = this.setScrollStatus;app.that = this;},setScrollStatus(isSorll){var app = getApp();//这里的this获取不到 当前page内的属性 所以之前要把this存入全局变量that中app.that.setData({isSorll})},
});
<--end-->
//在组件的js文件中 点击弹窗之前禁用视图的滚动
Component({handleShowModel() {var app = getApp();//显示弹窗之前禁用外层视图的滚动app.myProvide(false)//显示弹窗this.setData({isFlag: true})},
})
这样就优雅的解决了视图层同步子组件滚动的问题