zoukankan      html  css  js  c++  java
  • [转]微信小程序全局分享转发控制实现——从此无需页面单独配置

     关于支付宝全局自定义分享控制详见:支付宝小程序的携带参数全局分享实现。

    为什么要写这篇文章?

    微信小程序没有全局分享配置,页面开启分享功能必须要在页面中定义分享事件函数 onShareAppMessage 才可以。如果项目中对页面分享的需求比较复杂点,那么默认的自定义分享会很麻烦的,而且还不一定能满足我们的需求,因此全局自定义分享配置的实现就非常有必要了。

    不仅仅能实现全局分享,还可以对不同页面实现不同的分享配置

    本例结合隐式路由,可实现全局控制所有页面的分享配置,包括全局分享、页面默认分享、页面自定义分享,如下图所示:

    如上,一部分页面可以进行自定义分享,另一部分进行页面默认分享(相当于页面开启分享功能,但是没有进行配置),其他大部分页面都进行全局分享配置。

    示例代码:

    // app.js
    /**
     * 全局分享配置,页面无需开启分享
     * 使用隐式页面函数进行页面分享配置
     * 使用隐式路由获取当前页面路由,并根据路由来进行全局分享、自定义分享
     */
    ! function () {
      //获取页面配置并进行页面分享配置
      var PageTmp = Page
      Page = function (pageConfig) {
        //1. 获取当前页面路由
        let routerUrl = ""
        wx.onAppRoute(function (res) {
          //app.js中需要在隐式路由中才能用getCurrentPages()获取到页面路由
          let pages = getCurrentPages(),
            view = pages[pages.length - 1];
          routerUrl = view.route
        })
    
        //2. 全局开启分享配置
        pageConfig = Object.assign({
          onShareAppMessage: function () {
            //根据不同路由设置不同分享内容(微信小程序分享自带参数,如非特例,不需配置分享路径)
            let shareInfo={}
            let noGlobalSharePages=["index/index"]
            //全局分享配置,如部分页面需要页面默认分享或自定义分享可以单独判断处理
            if (!routerUrl.includes(noGlobalSharePages)){
              shareInfo = {
                title: "自定义全局分享",
                imageUrl: wx.getStorageSync("shareUrl")
              }
            }
            return shareInfo
          }
        }, pageConfig);
        // 配置页面模板
        PageTmp(pageConfig);
      }
    }();
    

      

    注意事项:

    1.本例中使用了 getCurrentPages() 函数获取页面路由,但是app.js中需要放在隐式路由 wx.onAppRoute() 的回调中才能获取到;

    2.使用本例方法,无需页面中配置 onShareAppMessage() ,如页面中配置分享事件函数,则会覆盖全局分享。


    ---------------------
    作者:逍遥云天
    来源:CNBLOGS
    原文:https://www.cnblogs.com/xyyt/p/12614181.html
    版权声明:本文为作者原创文章,转载请附上博文链接!
    内容解析By:CSDN,CNBLOG博客文章一键转载插件

  • 相关阅读:
    我们可以用SharePoint做什么
    HTML <!DOCTYPE> 标签
    一种支持任意尺寸的图片滑动(上下左右滑动)效果
    CSS选择器
    用css截取字符 css排版隐藏溢出文本
    Web前端行业的了解
    java07课堂作业
    设计模式原型模式
    设计模式建造者
    设计模式抽象工厂
  • 原文地址:https://www.cnblogs.com/admans/p/14684201.html
Copyright © 2011-2022 走看看