微信公众号隐藏分享按钮

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
需求
  写了一个微信公众号H5活动界面,然后用户可以分享,其中有一个坑就是,分享功能是通过调后台接口,
 
  然后配置微信config,设置 jsApiList【】 获取微信分享的方法的api实现的,  这时候产品经理的骚操作来咯,
 
  刚刚跳转到界面,后端数据都没有加载出来,就点击右上角按钮,分享内容到好友,朋友圈,  分享出去的链接就报错了,没办法,得找到解决办法,
 
  发现可以通过微信浏览器私有接口 WeiXinJsBridge 实现功能,具体实现就是一进入界面
 
   就执行WeiXinJsBridge  方法隐藏分享按钮, 然后等数据接收到了,    就调用jsApiList 里面的方法  显示按钮
 
通过微信浏览器私有接口 WeixinJSBridge 方法实现
    1.分享功能(好友,朋友圈,微博等)
 
    1.返回功能(可参考:关闭内置浏览器返回对话框)
 
    3.隐藏功能(工具栏等)
 
  第二个,使用上方功能需调用的 JS 文件,可以使用 res-jweixin-1.6.0.js 或者 res2-jweixin-1.6.0.js   这两个都行的,随便那个都可以,详情可参考:官方 JS-SDK 文档
 
  第三个,hideOptionMenu 方法,字面意思隐藏菜单,据说隐藏的菜单只能是“传播类”和“保护类”按钮,
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
vue 当中使用
    created() {
  // 隐藏分享菜单
          if (typeof WeixinJSBridge == "undefined") {
            if (document.addEventListener) {
              document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
            } else if (document.attachEvent) {
              document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
              document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
            }
          } else {
            WeixinJSBridge.call('hideOptionMenu')
          }
    },
  
 // 显示按钮
        window.wx.ready(() => {  
          setTimeout(() => {
            wx.showMenuItems({
              menuList: [
                'menuItem:share:timeline',
                'menuItem:share:qq',
                'menuItem:favorite',
              ] // 要显示的菜单项,所有menu项见附录3
            })
          }, 1500);

  

posted @   live丶  阅读(532)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
· 上周热点回顾(2.17-2.23)
点击右上角即可分享
微信分享提示