评论

开放标签wx-open-launch-weapp的一些问题认知

对于<wx-open-launch-weapp>标签,在社区搜索了很多,也得到了一些好心人的指点,所以我希望我遇到的问题能帮到你们,对此我把他列出来,写的不好,莫怪

先上代码:

 普通HTML版本为:(由于使用代码选项,保存无法显示,所以只能文本显示了)

<wx-open-launch-weapp
  id="launch-btn"
  username="gh_xxxxxxxx"
  path="pages/home/index?user=123&action=abc"
>
  <script type="text/wxtag-template">
    <style>.btn { padding: 12px }</style>
    <button class="btn">打开小程序</button>
  </script>
</wx-open-launch-weapp>
<script>
  var btn = document.getElementById('launch-btn');
  btn.addEventListener('launch', function (e) {
    console.log('success');
  });
  btn.addEventListener('error', function (e) {
    console.log('fail', e.detail);
  });
</script>

        

如果是使用框架,则为:

<div class="test-position"

  <wx-open-launch-weapp id="launch-btn" username="gh_**  *" path="pages/index/index.html?user=123&action=abc">

     <template>

       <style>.btn { padding: 12px; height: 100px; width: 120px; }</style>

         <button class="btn">打开小程序-测试方法二</button>

     </template>

  </wx-open-launch-weapp>

</div>


如果框架写上还不行,可以试试在文件main.js中,写上:
Vue.config.ignoredElements = ['wx-open-launch-app''wx-open-launch-weapp'];


代码就写完了,说说需要注意的几点吧:

1、在开放标签中,<template>或者<script>里面的写样式,千万不要使用定位position,如果非要用就在最外层的div里面写,例如我这里的class=‘test-position’这里定位;

2、如果你觉得里面写样式不好写,可以在里面样式style写opacity:0;,这样的话开放标签只是用来填充,大小自己控制就行;

3、如果你跳转之后显示页面不存在,请检查下path的路径结尾是否写上了.html;

4、开发工具是无法测试的,只能使用手机测试,如果你在手机分享功能正常,说明你初始化授权没问题,记得要在初始化授权写上开放标签openTagList: ['wx-open-launch-weapp'];如果手机发现按钮不见了,初始化授权是ok的,只是标签写法出来问题;请查看其他注意点;

微信版本要求为:7.0.12及以上。 系统版本要求为:iOS 10.3及以上、Android 5.0及以上。

5、如果还不行,然后初始化授权也是成功的,请质疑一下后台初始化授权信息的jssdk中,APPID是否你想要的公众号,眼见为实;

6、如果还不行,请移步到微信官网查看是否有其他问题:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html

最后一次编辑于  2021-05-18  
点赞 6
收藏
评论

41 个评论

  • Harlan
    Harlan
    2021-07-29

    我遇到一个问题wx-open-launch-weapp跳转到小程序web-view页面会再跳一次到一个空白页

    2021-07-29
    赞同
    回复 1
    • 哈罗哈皮
      哈罗哈皮
      2021-07-29
      正常逻辑不会有,检查下H5是否有重定向?要是没问题就只能反馈给官方了
      2021-07-29
      回复
  • 蒋蒋蒋蒋菇凉
    蒋蒋蒋蒋菇凉
    2021-07-20

    请问这个条件 你们是用的什么方法判断的?

    2021-07-20
    赞同
    回复 1
    • 哈罗哈皮
      哈罗哈皮
      发表于小程序端
      2021-07-20

      说实话,我直接忽略了,因为要是这个版本的微信估计是老人机了

      2021-07-20
      回复
  • qiuwww
    qiuwww
    2021-07-08

    我这里有一个处理方式,方便调试,应用方便:https://juejin.cn/post/6891541908858863630

    2021-07-08
    赞同
    回复
  • Gainer
    Gainer
    2021-05-19

    兄弟,我的监测不到launch事件,功能在安卓机上正常实现了,但是他是否确实跳转这个因为监测不到这个事件,导致无法判断 用的是uniapp然后vue框架

    2021-05-19
    赞同
    回复
  • 养了个傻狍子
    养了个傻狍子
    2021-05-17

    react的,按照文档写的,不显示按钮,代码如下

    <wx-open-launch-weapp
                id="appContainer"
                username="username"
                path="pathname"
              >
                <script type="text/wxtag-template">
                  <button>打开小程序</button>
                </script>
              </wx-open-launch-weapp>
    
    2021-05-17
    赞同
    回复 2
  • Humi
    Humi
    2021-03-17

    遇到一个问题,开放标签在悬浮按钮中,但是无法拖拽,会是什么原因呢

    2021-03-17
    赞同
    回复 2
    • 哈罗哈皮
      哈罗哈皮
      2021-03-22
      我没记错的话,官方不建议定位显示按钮,有时定位还不能显示按钮
      2021-03-22
      回复
    • Humi
      Humi
      2021-05-11回复哈罗哈皮
      动态渲染的按钮,或者弹层里的按钮,还会出现只显示一半😂
      2021-05-11
      回复
  • 🐯
    🐯
    2021-03-09

    Vue写的,安卓真机显示不出,ios真机可以,模拟器所有机型可以,有人遇过吗

    2021-03-09
    赞同
    回复 2
    • 时光如水
      时光如水
      2021-04-26
      遇到了...
      2021-04-26
      回复
    • 哈罗哈皮
      哈罗哈皮
      2021-05-11回复时光如水
      目前不支持模拟器或开发工具测试,文档有说
      2021-05-11
      回复
  • 复杂人生
    复杂人生
    2021-01-29

    我使用的框架,按照框架改了标签,但是还是不展示按钮

    2021-01-29
    赞同
    回复 2
    • 哈罗哈皮
      哈罗哈皮
      2021-02-01
      你把配置设置下:Vue.config.ignoredElements = ['wx-open-launch-app', 'wx-open-launch-weapp'];
      然后发到正式测试下
      2021-02-01
      回复
    • 复杂人生
      复杂人生
      2021-02-03回复哈罗哈皮
      我配置了对应的这个,谢谢你的回答 我找到我这边不能出来的原因了 是我本地引入了我们项目的jssdk和文档上面的jssdk,不引入本地的jssdk我的就出来了
      2021-02-03
      回复
  • 🍧
    🍧
    2021-01-11

    按照微信官网的模板写,按钮不显示,怎么回事

    2021-01-11
    赞同
    回复 1
    • 哈罗哈皮
      哈罗哈皮
      2021-01-14
      你有没有使用框架?现在可以?
      2021-01-14
      回复
  • 🍧
    🍧
    2021-01-11

    请问,我看不到按钮标签是怎么回事

    2021-01-11
    赞同
    回复

正在加载...

登录 后发表内容