收藏
回答

点金计划 商家小票页面首次加载显示空白页,刷新后可以显示出内容,什么原因导致的?

 mounted () {
    this.init()
  },
  methods: {
    init () {
      // 初始化小票
      var initData = {
        action: 'onIframeReady',
        displayStyle: 'SHOW_CUSTOM_PAGE'
      }
      var initPostData = JSON.stringify(initData)
      parent.postMessage(initPostData, 'https://payapp.weixin.qq.com')


      const urlParams = new URLSearchParams(window.location.search)
      // 遍历所有参数
      for (const [key, value] of urlParams.entries()) {
        if (key == 'out_trade_no') {
          this.outTradeNo = value
        }
        if (key == 'channel') {
          this.channel = value
        }
        console.log(`${key}: ${value}`)
      }
      getOrdernew({ outTradeNo: this.outTradeNo, channel: this.channel }).then(res => {
        console.log(res)
        this.orderId = res.data.orderId
        this.payAmount = res.data ? res.data.payAmount / 100 : ''
      })
    },
    handleTo () {
      const url = window.location.origin + '/m-shop/checkResult?out_trade_no=wx_' + this.orderId
      var mchData = {
        action: 'jumpOut',
        jumpOutUrl: url // 跳转的页面
      }
      var postData = JSON.stringify(mchData)
      parent.postMessage(postData, 'https://payapp.weixin.qq.com')
    }
  }

最后一次编辑于  04-10
回答关注问题邀请回答
收藏

2 个回答

  • Flipped
    Flipped
    04-10

    微信商家小票页面无法动态获取屏幕宽高,若未手动设置htmlfont-size,可能导致基于rem的布局元素因默认font-size=0而无法渲染,表现为白屏。

    解决方案

    在Vue组件的mounted生命周期中,强制设置htmlfont-size

    document.querySelector('html').style.fontSize = "40px"; // 必须固定值,不可动态计算
    


    04-10
    有用 2
    回复
  • Memory
    Memory
    04-10

    页面是提示什么?无法获取订单信息?

    04-10
    有用
    回复 10
    • Flipped
      Flipped
      04-10
      你好,什么提示都没有,就是一个空白页面,但是刷新完后就会出现,后面在进入就不会出现空白页了
      04-10
      回复
    • Memory
      Memory
      04-10回复Flipped
      修改一下你的提问,贴你的代码不要用截图的形式。我验证一下
      04-10
      回复
    • Flipped
      Flipped
      04-10回复Memory
      好的
      04-10
      回复
    • Flipped
      Flipped
      04-10回复Memory
      您看看,vconsole倒是可以显示出来,内容加载不出来,刷新后就可以
      04-10
      回复
    • Memory
      Memory
      04-10回复Flipped
      你页面有没有引用其他的js文件?
      04-10
      回复
    查看更多(5)
登录 后发表内容