钉钉小程序使用getApp实现类似provide inject的功能 应用场景:解决页面同步子组件弹窗的滚动问题

前言:在开发钉钉小程序的时候 组件内部的弹窗滚动会带着视图同步滚动 所以需要在组件内部弹窗显示的时候禁用视图的scroll滚动 由于我组件封装的比较深 不可能逐级传递 dd也么有provide的语法 所以我使用的getApp 完成控制的效果 最终完美运行 觉得有帮助相互关注一下 后续会持续更新钉钉小程序的坑 废话不多说了 直接上代码

   //首先在app.js里面定义全局变量
    
App({
  //存储回调的函数
  myProvide:null,
  //存储当前页面的this
  that: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
      })
    },
})

这样就优雅的解决了视图层同步子组件滚动的问题