在微信中隐藏或显示部分菜单完整流程

1. 引入微信sdk

const wx = require("weixin-js-sdk"); // 引入微信sdk

2. 判断是不是微信浏览器

export const isWeixinMiniProgram = async function () {
    var ua = window.navigator.userAgent.toLowerCase()
    if (ua.match(/MicroMessenger/i) == 'micromessenger') { //微信浏览器
        let result = await getEnvMiniProgram()
        return result
    } else {
        return false
    }
}

3. 判断是不是在微信小程序环境

export const getEnvMiniProgram = function () {
    return new Promise((resolve, reject) => {
        wx.miniProgram.getEnv((res) => {
            if (res.miniprogram) {
                console.log("在小程序中")
                resolve('miniProgram')
            } else {//在微信中
                resolve('wechat')
            }
        })
    })
}

4. 获得微信配置（后台提供接口）

export const getWXJSConfig = (params) => {
    return network({
        url: baseUrl + `/getJSConfig?${stringify(params)}`,
        method: 'get',
    })
}

5. (不必要) 获取url数据 window.DATA里面的值或者为pageData缓存中的

export const getUrlData =  (val) => {
    if (val) { // value有值则取单个key 否则获取window.DATA的对象
        return (getType(window.DATA) && getType(window.DATA[val])) ? window.DATA[val] : ''
    } else {
        return getType(window.DATA) ? window.DATA : ''
    }
}

6. 微信初始化

export const wxUtils = (jsURL) => {
  return new Promise(async (resolve, reject) => {
    const platType =await isWeixinMiniProgram()
    getWXJSConfig({
      jsURL: jsURL,
      weichatNo:platType=='miniProgram'?'':getUrlData('weichatNo')
    }).then(async res => {
      await wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: res.appId,// 必填，企业号的唯一标识，此处填写企业号corpid
        timestamp: res.timestamp,// 必填，生成签名的时间戳
        nonceStr: res.nonceStr,// 必填，生成签名的随机串
        signature: res.signature,// 必填，签名
        jsApiList: ['getLocation','startRecord','stopRecord','onVoiceRecordEnd','playVoice','pauseVoice','stopVoice','onVoicePlayEnd','translateVoice','openLocation','hideMenuItems','onMenuShareTimeline','onMenuShareAppMessage'],
        openTagList: ["wx-open-launch-weapp"] // 跳转小程序时必填
      });
      wxReady(resolve)
    }).catch(error => {
      reject();
    })
  })
}

8. 配置微信

const wxReady = resolve => {
  wx.ready(() => {
    wx.hideMenuItems({ // 隐藏部分菜单按钮
      menuList: [
        'menuItem:share:timeline', // 分享给朋友圈 自定义H5页可分享朋友圈
        'menuItem:share:qq', // 分享到QQ
        'menuItem:share:weiboApp', // 分享到Weibo
        'menuItem:favorite', // 收藏
        'menuItem:share:QZone', // 分享到 QQ 空间
        'menuItem:copyUrl', // 复制链接
        'menuItem:openWithQQBrowser', // 在QQ浏览器中打开
        'menuItem:openWithSafari', // 在Safari中打开
        'menuItem:share:email', // 邮件
        'menuItem:readMode', // 阅读模式
        'menuItem:originPage' // 原网页
      ]
    });

    wx.showMenuItems({    //显示部分菜单按钮
      menuList: [
        'menuItem:addContact',
        'menuItem:refresh',
        'menuItem:profile',
        'menuItem:share:brand'
      ]
    });
    resolve();
  });
};

可以隐藏或者显示的菜单代码如下：

基本类

• 举报: “menuItem:exposeArticle”
• 调整字体: “menuItem:setFont”
• 日间模式: “menuItem:dayMode”
• 夜间模式: “menuItem:nightMode”
• 刷新: “menuItem:refresh”
• 查看公众号（已添加）: “menuItem:profile”
• 查看公众号（未添加）: “menuItem:addContact”

传播类

• 发送给朋友: “menuItem:share:appMessage”
• 分享到朋友圈: “menuItem:share:timeline”
• 分享到QQ: “menuItem:share:qq”
• 分享到Weibo: “menuItem:share:weiboApp”
• 收藏: “menuItem:favorite”
• 分享到FB: “menuItem:share:facebook”
• 分享到 QQ 空间/menuItem:share:QZone

保护类

• 编辑标签: “menuItem:editTag”
• 删除: “menuItem:delete”
• 复制链接: “menuItem:copyUrl”
• 原网页: “menuItem:originPage”
• 阅读模式: “menuItem:readMode”
• 在QQ浏览器中打开: “menuItem:openWithQQBrowser”
• 在Safari中打开: “menuItem:openWithSafari”
• 邮件: “menuItem:share:email”
• 一些特殊公众号: “menuItem:share:brand”