共计 2076 个字符,预计需要花费 6 分钟才能阅读完成。
全局自定义分享——应用微信小程序隐式页面配置函数实现
本例应用了隐式函数 Page
以及返回对象 pageConfig
来对以后拜访页面进行自定义分享配置,具体代码如下:
// app.js 中 App({})外写 | |
/** | |
* 全局分享配置,页面无需开启分享 | |
* 应用隐式页面函数进行页面分享配置 | |
* 应用隐式路由(wx.onAppRoute)获取以后页面路由,并依据路由来进行全局分享、自定义分享 | |
*/ | |
! function () { | |
let shareUrl= 'http://XXXX/image/xx.jpg' | |
// 获取页面配置并进行页面分享配置 | |
var PageTmp = Page | |
Page = function (pageConfig) { | |
//1. 获取以后页面路由 | |
let routerUrl = "" | |
wx.onAppRoute(function (res) {let pages = getCurrentPages(), | |
view = pages[pages.length - 1]; | |
routerUrl = view.route | |
}) | |
//2. 全局开启分享配置 | |
pageConfig = Object.assign({onShareAppMessage: function () { | |
// 依据不同路由设置不同分享内容(微信小程序分享自带参数,如非特例,不需配置分享门路)let shareInfo={} | |
console.log('配置页面路由',routerUrl) | |
// let noGlobalSharePages=["index/index"] | |
// // 全局分享配置,如局部页面须要页面默认分享或自定义分享能够独自判断解决 | |
// console.log('includes',routerUrl.includes(noGlobalSharePages)) | |
// 判断地址中是否蕴含指定的指定的子字符串,如果蕴含则返回 true,则走页面自定义,取反走这里的逻辑 | |
// if (!routerUrl.includes(noGlobalSharePages)){ | |
// shareInfo = { | |
// title: "自定义全局分享", | |
// imageUrl: wx.getStorageSync("shareUrl"), | |
// path: '/'+ routerUrl, | |
// } | |
// } | |
// 目前发现这里的变量只能用 App 外定义的全局的,或者缓存~~~~ | |
shareInfo = { | |
title: "自定义全局分享", | |
imageUrl: shareUrl, | |
path: '/'+ routerUrl, | |
} | |
console.log('自定义全局分享',shareInfo) | |
return shareInfo | |
} | |
}, pageConfig); | |
console.log('配置页面模板',pageConfig) | |
// 配置页面模板 | |
PageTmp(pageConfig); | |
} | |
}(); |
性能体现:
- 只须要入口 js 中配置如上代码,即可实现全局自定义分享;
- 如果页面配置有分享事件的函数,那么全局分享将生效,间接走页面的分享(即便页面分享未配置内容,只有关上 onShareAppMessage 就会走页面分享);
- 如果应用全局分享每个页面无需去写 onShareAppMessage 这个办法,如果页面再次定义了 onShareAppMessage, 则依照页面定义的显示分享内容。
- 经屡次验证,上述办法实现的全局分享主动携带以后页面的残缺参数,无需另外获取。
应用隐式路由间接实现全局分享配置:
这种办法间接实现全局分享只是批改分享配置,前提是 页面必须配置分享事件函数,否则有效。
App({onLaunch: function() {this.overShare() | |
}, | |
/** | |
* 间接实现全局设置分享内容(须要页面配置分享事件函数)*/ | |
overShare: function() { | |
let self = this | |
// 调用暗藏路由回调 | |
wx.onAppRoute(function(res) { | |
// 获取加载的页面 | |
let pages = getCurrentPages(), | |
// 获取以后页面的对象 | |
view = pages[pages.length - 1], | |
data; | |
if (view) { | |
data = view.data; | |
if (true || !data.isOverShare) { | |
data.isOverShare = true; | |
view.onShareAppMessage = function() { | |
// 重写分享配置 | |
return { | |
title: '分享题目', | |
imageUrl: wx.getStorageSync("shareUrl") | |
}; | |
} | |
} | |
} | |
}) | |
}, | |
}) |
总结:
通过上边的两种形式,咱们曾经实现了全局自定义分享。如果须要对大部分页面进行全局分享配置(指定题目、图片、页面门路),那么在 app.js 中的全局分享代码中进行配置就好了。对于局部须要独自配置的,能够间接在页面进行特定配置就好了。
所以剖析两种办法的应用状况如下:
第一种办法,无需在每个页面写分享函数,如果写了,则页面本人定义的起作用,全局的办法生效,能够利用定义独自的分享。
第二种办法,必须在每个页面写上分享函数,它会笼罩所有页面的分享,只有全局的配置能够用。无奈独自写分享配置
正文完
发表至: javascript
2021-04-09