uni-app+iview 开发微信、支付宝小程序的兼容问题

💪只要需求不停，更新就不停...💪

0.登录、地理位置授权、获取头像昵称：必须单独处理

定位地理位置的封装动动小手✋

点进去参考这个juejin.cn/post/707477…

只需要改成支付宝特有的就行了，换汤不换药~

1.socket兼容问题：

解决办法：单独定义函数

  //#ifdef MP-WEIXIN
  this.wechatSocket(res)
  //#endif


  //#ifdef MP-ALIPAY
  this.aliSocket(res)
  //#endif

wechatSocket(params){
    // Socket
    uni.connectSocket({
            url: 'wss://java-ws'+ hosts().domin +'/screen?roomId=' + params.data.uuid
    });
    uni.onSocketOpen(() => {
            console.log('WebSocket连接已打开！');
    });
    uni.onSocketError(() => {
            console.log('WebSocket连接打开失败，请检查！');
    });
    uni.onSocketMessage((res)=> {
            this.handleSocket(res.data)
    });
}

aliSocket(){
    my.connectSocket({
      url: 'wss://java-ws'+ hosts().domin +'/screen?roomId=' + params.data.uuid
    });
    my.onSocketOpen(function() {
      // 注：只有连接正常打开中 ，才能正常收到消息
      my.onSocketMessage(function(res) {
        this.handleSocket(res.data)
      });
    })


    my.onSocketClose(() => {
      // 支付宝小程序的ws连接问题，关闭连接时需关闭对于接受，防止关闭失败
      my.offSocketMessage();
      my.offSocketError();
      my.offSocketOpen();
      my.offSocketClose();                
    })


    my.onSocketError(function(res) {
      console.log('WebSocket连接打开失败，请检查！');
    })
  }

2.背景色渐变问题：

微信小程序正常显示，支付宝不支持

解决办法：使用纯色背景，减少渐变的使用（不过这个问题在我的模拟器上有问题，同事的模拟器没有黑色那条线）

3.uview中支付宝不支持readMore组件

解决方案：将u-read-more组件中u--text改为u-text  

4、zpaging插件，onshow的时候调refush的时候会报错

解决方案：加$nextTick

5.u-navbar组件支付宝渲染出空标签，且有高度

解决方案：safeAreaInsetTop参数设置为false

6.支付宝自义定导航栏：

解决办法：page.json里添加

"mp-alipay": {
  "transparentTitle": "always",
  "titlePenetrate": "YES"
}

7.支付provider要根据系统获取：

let provider = 'wxpay'
uni.getProvider({
  service: 'oauth',
  success: function (res) {
    provider = res.provider
  }
});

8.uni-swiper-dot 标签在支付宝小程序中不支持

9.uni-showToast 不支持icon:loaoding和duration：xxx

10:v-show 微信小程序支持，支付宝小程序不支持 11.picker不支持支付宝，uview也不支持 解决方法： 需要更改uview的picker代码