收藏
回答

使用<wx-open-launch-weapp>,页面打开时路由自动跳转,按钮会失效?

VUE框架下的HTML5页面,vue-router,当第一次进入页面,且未带有路由信息时,按路由配置自动跳到指定页面。

这个跳转动作,会导致页面按钮失效,且不触发ready事件。

但路由跳转完成后,刷新一次页面按钮即可恢复。

按钮为动态创建。

做了以下场景验证:

  • vue-router: hash路由,跳转发生hashchange,url变化,必现。
  • vue-router: history路由,replaceState进行queryParams的encode,url变化,必现。
  • react-router: hash路由,同vue-router:hash,必现。
  • window.location.href重定向,必现。

整体看起来,只要url发生变化,按钮就会失效。

请问是什么原因?

谢谢,盼复。

回答关注问题邀请回答
收藏

3 个回答

  • Marvin
    Marvin
    2020-08-25

    录屏:1、从链接地址https://oss.suning.com/vss/activity/wximg/magic/demo/test-wx-weapp.html?v=4进入,wx.config提示OK,但open-type按钮不显示。2、刷新页面,wx.config提示OK,open-type按钮才会显示。

    2020-08-25
    有用 1
    回复 1
    • Mr.战神
      Mr.战神
      2022-07-04
      老哥 还在没? 有事
      2022-07-04
      回复
  • hhlv
    hhlv
    2023-01-10

    IOS微信会缓存首次页面地址,如果是单页面,使用vuerouter去更改路由的话,不会刷新页面。微信缓存的地址就不会变,这时候去做wxconfig时候的提交url和访问url就会不一致导致注册失败。

    从这个原理上要解决方案就2个方向,要么针对用了<wx-open-launch-weapp>的页面,不要使用vuerouter跳转页面,可以使用window.location.href这种刷新页面的方案去跳转。或者可以尝试下,在IOS里,注册wxconfig时提交的URL不要是当前的路由,而是进入的第一个页面的路由。

    2023-01-10
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2020-08-17

    请具体描述问题出现的流程,并提供能复现问题的链接

    2020-08-17
    有用
    回复 8
    • Marvin
      Marvin
      2020-08-20
      https://oss.suning.com/vss/activity/wximg/magic/demo/test-wx-weapp.html?v=4
      辛苦看下这个demo地址。
      第一次打开时,内部有意做了一个hash跳转,url变为"...?v=4#somehash"。这个跳转动作,会导致weapp内的button元素不显示。然后再刷新一下页面即会显示button按钮。
      2020-08-20
      回复
    • Marvin
      Marvin
      2020-08-20
      iOS特有,安卓自测OK。
      2020-08-20
      回复
    • 疯狂的小辣椒
      疯狂的小辣椒
      2020-08-20回复Marvin
      试了iPhone11,微信版本7.0.15没有复现,可以补充下问题机型、系统版本、微信版本,复现GIF图或者视频
      2020-08-20
      1
      回复
    • Marvin
      Marvin
      2020-08-25
      麻烦请看下下面的回复
      2020-08-25
      回复
    • Marvin
      Marvin
      2020-08-26
      微信版本7.0.15,iPhone8p,iOS13.6.1
      2020-08-26
      回复
    查看更多(3)
登录 后发表内容
问题标签