uView插件使用 u-navbar自定义导航(分享无法返回)
背景分析:uni-app原生导航栏返回是没有问题的,不管是正常打开页面还是分享后的页面,但是无法自定义导航背景色(官网说page-meta标签)但是我尝试了没有效果,所以还是使用的uView组件自定导航栏;
使用自定义的弊端为:用户分享页面到微信好友后,好友点击分享的页面,点击左上角返回按钮无法返回小程序首页,点击手机自带的返回按钮就直接返回聊天记录了啊啊啊。。。。。就很无语。
解决方案:在自定义导航栏组件外部套一个view标签,并且绑定点击事件,(判断当前页面是否为分享页面,若是则返回首页,否则就按照最先写好的返回事件走就ok)
<view @click="goHome">
<nav-bar :navbar_title="navBar.title" :leftText="navBar.leftText" :backUrl="navBar.backUrl"
:urlType="navBar.urlType"></nav-bar>
</view>
onLoad(option) {
if(option.userId){
uni.setStorageSync('share_param',option.userId);
}
if(option.isShare){ //isShare参数是分享页面时拼接的参数
this.isShare = option.isShare; } },
methods: {
/* 分享返回首頁 */
goHome(){
if(this.isShare){ // 表示当前打开页面是分享页面,返回需要返回小程序首页
uni.switchTab({
url:"../../pages/index/index"
})
}
},
}
share.js
export const shareMixins = {
data() {
return {
shareData: {
title: '',
path: '/pages/index/index',
imageUrl: '',
content: '',
desc: '',
},
}
},
//#ifdef MP-WEIXIN
onShareAppMessage(res) {
console.log('onShareAppMessage_res',res);
if (res.from === 'button') {// 来自页面内分享按钮
console.log('分享参数',res.target)
uni.showToast({
title:JSON.stringify(res.target),
icon:"none",
duration:200000000
})
}
return {
title: this.shareData.title,
path: this.shareData.path,
imageUrl: this.shareData.imageUrl,
content: this.shareData.content,
desc: this.shareData.desc,
user_id: this.shareData.user_id,
success: res => {
}
}
},
//#endif
/* 分享到微信好友 */
onShareAppMessage(res) {
let _this = this;
console.log('onShareAppMessage_res==',res);
const promise = new Promise(resolve => {
setTimeout(() => {
resolve({
title: _this.shareData.title,
path: _this.shareData.path,
})
}, 2000)
})
return {
title: this.shareData.title,
path: '',
promise
}
},
// 分享到朋友圈
onShareTimeline: function() {
return {
title: this.shareData.title,
query: '001',
imageUrl: this.shareData.imageUrl,
}
},
onLoad() {
let currentRoutes = getCurrentPages(); // 获取当前打开过的页面路由数组
let currentRoute = currentRoutes[currentRoutes.length - 1].route; //获取当前页面路由
let _userInfo = this.checkLogin();
if(_userInfo.id){
this.shareData.path= currentRoute + '?isShare=true' + '&userId='+_userInfo.id; //已登录
}else{
this.shareData.path= currentRoute + '?isShare=true'; // 未登录
}
},
methods:{
}
}
本文来自博客园,作者:小虾米吖~,转载请注明原文链接:https://www.cnblogs.com/LindaBlog/p/16347715.html
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 【.NET】调用本地 Deepseek 模型
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
2019-06-06 js基础——基本包装类型
2019-06-06 js基础——变量、作用域、内存
2019-06-06 js基础——面向对象(构造函数)
2019-06-06 js基础——继承