新增首页骨架屏并优化页面体验
This commit is contained in:
@@ -1,3 +1,5 @@
|
||||
// common/constants/routes.js
|
||||
|
||||
/** 与 pages.json 保持一致 */
|
||||
export const PAGE = {
|
||||
INDEX: '/pages/index/index',
|
||||
@@ -67,27 +69,61 @@ export function getCurrentRoutePath() {
|
||||
return normalizePath(route ? `/${route}` : PAGE.INDEX)
|
||||
}
|
||||
|
||||
/**
|
||||
* 跳转到普通页面(非 TabBar 页面)
|
||||
* 使用 navigateTo,保留页面栈,可以正常返回
|
||||
*/
|
||||
export function navigateToPage(url) {
|
||||
uni.showLoading({ title: '加载中...', mask: true })
|
||||
const path = normalizePath(url)
|
||||
|
||||
// ✅ 如果目标是 TabBar 页面,不应该使用 navigateTo
|
||||
// 这种情况应该使用 switchToTabPage(会清空页面栈)
|
||||
if (TAB_PAGES.has(path)) {
|
||||
switchToTab(path)
|
||||
console.warn('[navigateToPage] 不应该用 navigateTo 跳转 TabBar 页面,请使用 switchToTabPage')
|
||||
switchToTabPage(path)
|
||||
return
|
||||
}
|
||||
|
||||
console.log('[navigateToPage] 跳转到:', url)
|
||||
|
||||
uni.navigateTo({
|
||||
url,
|
||||
fail: (err) => {
|
||||
console.error('[navigateTo]', url, err)
|
||||
uni.showToast({ title: '页面跳转失败', icon: 'none' })
|
||||
}
|
||||
// 页面栈满时降级使用 redirectTo
|
||||
if (err.errMsg && err.errMsg.includes('limit')) {
|
||||
uni.redirectTo({ url })
|
||||
} else {
|
||||
uni.showToast({ title: '页面跳转失败', icon: 'none' })
|
||||
}
|
||||
},
|
||||
success: () => {
|
||||
setTimeout(() => {
|
||||
uni.hideLoading()
|
||||
},3000)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export function switchToTab(url) {
|
||||
/**
|
||||
* 跳转到 TabBar 页面(清空页面栈)
|
||||
* 用于从任何页面跳转到首页/课程/训练等 TabBar 页面
|
||||
*/
|
||||
export function switchToTabPage(url) {
|
||||
const path = normalizePath(url)
|
||||
if (!TAB_PAGES.has(path)) {
|
||||
console.warn('[switchToTabPage] 目标不是 TabBar 页面:', path)
|
||||
navigateToPage(url)
|
||||
return
|
||||
}
|
||||
|
||||
if (getCurrentRoutePath() === path || tabNavigating) return
|
||||
|
||||
|
||||
console.log('[switchToTabPage] 跳转到 TabBar:', path)
|
||||
|
||||
tabNavigating = true
|
||||
uni.reLaunch({
|
||||
uni.switchTab({ // ✅ 改用 switchTab,而不是 reLaunch
|
||||
url: path,
|
||||
complete: () => {
|
||||
setTimeout(() => {
|
||||
@@ -95,25 +131,59 @@ export function switchToTab(url) {
|
||||
}, 320)
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('[reLaunch]', path, err)
|
||||
tabNavigating = false
|
||||
uni.showToast({ title: '页面跳转失败', icon: 'none' })
|
||||
console.error('[switchTab]', path, err)
|
||||
// 降级使用 reLaunch
|
||||
uni.reLaunch({
|
||||
url: path,
|
||||
complete: () => {
|
||||
setTimeout(() => {
|
||||
tabNavigating = false
|
||||
}, 320)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export function goToMemberCenter() {
|
||||
switchToTab(PAGE.MEMBER)
|
||||
}
|
||||
|
||||
export function goBackOrTab(fallbackUrl = PAGE.MEMBER) {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
fail: () => switchToTab(fallbackUrl)
|
||||
/**
|
||||
* 重置到 TabBar 页面(清空所有历史)
|
||||
* 用于退出登录、强制跳转等场景
|
||||
*/
|
||||
export function reLaunchToTabPage(url) {
|
||||
const path = normalizePath(url)
|
||||
console.log('[reLaunchToTabPage] 重置到:', path)
|
||||
|
||||
uni.reLaunch({
|
||||
url: path,
|
||||
fail: (err) => {
|
||||
console.error('[reLaunch]', path, err)
|
||||
uni.switchTab({ url: path })
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/** 子页面返回:统一回到 tab 页「个人中心」 */
|
||||
export function backToMemberCenter() {
|
||||
switchToTab(PAGE.MEMBER)
|
||||
/**
|
||||
* 返回上一页,如果没有上一页则跳转到指定 TabBar 页面
|
||||
*/
|
||||
export function goBackOrTab(fallbackUrl = PAGE.MEMBER) {
|
||||
const pages = getCurrentPages()
|
||||
if (pages.length > 1) {
|
||||
uni.navigateBack({ delta: 1 })
|
||||
} else {
|
||||
switchToTabPage(fallbackUrl)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 子页面返回个人中心
|
||||
*/
|
||||
export function backToMemberCenter() {
|
||||
goBackOrTab(PAGE.MEMBER)
|
||||
}
|
||||
|
||||
/**
|
||||
* 子页面返回指定 TabBar 页面
|
||||
*/
|
||||
export function backToTab(tabUrl) {
|
||||
goBackOrTab(tabUrl)
|
||||
}
|
||||
Reference in New Issue
Block a user