refactor: 统一重构底部导航栏间距逻辑与显示规则
1. 新增全局计算属性统一处理底部导航栏显示判断与间距样式 2. 替换多个页面的手写底部间距逻辑为通用样式 3. 新增路由匹配工具函数,支持灵活配置导航栏显示范围 4. 优化底部导航组件的显示条件判断
This commit is contained in:
@@ -22,6 +22,57 @@ export default {
|
||||
tabBarList() {
|
||||
return this.$store.state.tabBarList;
|
||||
},
|
||||
shouldShowTabBar() {
|
||||
const tabBarList = this.$store.state.tabBarList;
|
||||
if (!tabBarList || !tabBarList.list) {
|
||||
return false;
|
||||
}
|
||||
const mode = tabBarList.page_visibility_mode;
|
||||
const routeList = tabBarList.page_routes || [];
|
||||
if (!mode || mode === 'all') {
|
||||
return true;
|
||||
}
|
||||
if (mode === 'none') {
|
||||
return false;
|
||||
}
|
||||
const pages = getCurrentPages();
|
||||
if (pages.length === 0) {
|
||||
return true;
|
||||
}
|
||||
const currentPage = pages[pages.length - 1];
|
||||
let currentRoute = '';
|
||||
if (currentPage.route) {
|
||||
currentRoute = currentPage.route;
|
||||
} else if (currentPage.$page && currentPage.$page.path) {
|
||||
currentRoute = currentPage.$page.path;
|
||||
}
|
||||
if (!currentRoute) {
|
||||
return true;
|
||||
}
|
||||
if (!currentRoute.startsWith('/')) {
|
||||
currentRoute = '/' + currentRoute;
|
||||
}
|
||||
const inList = this.$util && this.$util.isPageInRouteList
|
||||
? this.$util.isPageInRouteList(currentRoute, routeList)
|
||||
: false;
|
||||
if (mode === 'whitelist') {
|
||||
return inList;
|
||||
}
|
||||
if (mode === 'blacklist') {
|
||||
return !inList;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
tabBarPagePaddingStyle() {
|
||||
return this.$util.objToStyle({
|
||||
paddingBottom: this.shouldShowTabBar ? '112rpx' : '0'
|
||||
});
|
||||
},
|
||||
tabBarPaddingStyleValue() {
|
||||
return {
|
||||
paddingBottom: this.shouldShowTabBar ? '112rpx' : '0'
|
||||
};
|
||||
},
|
||||
siteInfo() {
|
||||
return this.$store.state.siteInfo;
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user