|
@@ -1,74 +1,98 @@
|
|
|
<template>
|
|
|
- <view class="ezy-custom-tabbar">
|
|
|
- <view class="tabbar-item-box">
|
|
|
- <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path)"
|
|
|
- :style="{backgroundImage: 'url(' + item.iconPath + ')'}"></view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="ezy-custom-tabbar">
|
|
|
+ <view class="tabbar-item-box">
|
|
|
+ <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path)"
|
|
|
+ :style="{backgroundImage: 'url(' + item.iconPath + ')'}"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- tabList: [
|
|
|
- {iconPath: 'static/images/tabbar/unselect/plan-sj.png',path:`/pages/study/index` },
|
|
|
- {iconPath: 'static/images/tabbar/unselect/develop-sj.png',path:'/pages/study/index' },
|
|
|
- {iconPath: 'static/images/tabbar/unselect/partner-sj.png',path:'/pages/study/index' },
|
|
|
- {iconPath: 'static/images/tabbar/unselect/my-sj.png',path:`/pages/my/index` },
|
|
|
- // 更多 Tab 项...
|
|
|
- ]
|
|
|
- };
|
|
|
- },
|
|
|
- methods: {
|
|
|
+ import {
|
|
|
+ useTabBarHistory
|
|
|
+ } from '@/utils/emitEvents.js';
|
|
|
+ import {
|
|
|
+ toast
|
|
|
+ } from '@/utils/common'
|
|
|
+ export default {
|
|
|
|
|
|
- switchTab(path, params = {}) {
|
|
|
- // 将参数拼接到路径中
|
|
|
- let queryString = Object.keys(params).map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`).join('&');
|
|
|
- if (queryString) {
|
|
|
- path += `?${queryString}`;
|
|
|
- }
|
|
|
- uni.navigateTo({
|
|
|
- url: path
|
|
|
- });
|
|
|
- // 使用 uni.switchTab 进行跳转(适用于 tabBar 页面)
|
|
|
- // if (this.isTabBarPage(path)) {
|
|
|
- // uni.switchTab({
|
|
|
- // url: path
|
|
|
- // });
|
|
|
- // } else {
|
|
|
- // // 使用 uni.navigateTo 进行跳转(适用于非 tabBar 页面)
|
|
|
- // uni.navigateTo({
|
|
|
- // url: path
|
|
|
- // });
|
|
|
- // }
|
|
|
- },
|
|
|
- isTabBarPage(path) {
|
|
|
- // 根据你的 tabBar 页面路径进行判断
|
|
|
- const tabBarPages = ['/pages/study/index', '/pages/study/index','/pages/study/index','/pages/my/index'];
|
|
|
- return tabBarPages.includes(path);
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- console.log(this.$state);
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tabList: [{
|
|
|
+ iconPath: 'static/images/tabbar/unselect/plan-sj.png',
|
|
|
+ path: `/pages/study/index`
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: 'static/images/tabbar/unselect/develop-sj.png',
|
|
|
+ path: '/pages/study/index2'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: 'static/images/tabbar/unselect/partner-sj.png',
|
|
|
+ path: '/pages/study/index3'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: 'static/images/tabbar/unselect/my-sj.png',
|
|
|
+ path: `/pages/my/index`
|
|
|
+ },
|
|
|
+ // 更多 Tab 项...
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ switchTab(path, params = {}) {
|
|
|
+ if(path =='/pages/study/index2'||path =='/pages/study/index3'){
|
|
|
+ toast("此功能页面暂未开放!")
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ let storage = useTabBarHistory().getTabBarStorage()
|
|
|
+ let queryString = Object.keys(storage).map(key =>
|
|
|
+ `${encodeURIComponent(key)}=${encodeURIComponent(storage[key])}`).join('&');
|
|
|
+ if (queryString) {
|
|
|
+ path += `?${queryString}`;
|
|
|
+ }
|
|
|
+ uni.navigateTo({
|
|
|
+ url: path
|
|
|
+ });
|
|
|
+ // 使用 uni.switchTab 进行跳转(适用于 tabBar 页面)
|
|
|
+ // if (this.isTabBarPage(path)) {
|
|
|
+ // uni.switchTab({
|
|
|
+ // url: path
|
|
|
+ // });
|
|
|
+ // } else {
|
|
|
+ // // 使用 uni.navigateTo 进行跳转(适用于非 tabBar 页面)
|
|
|
+ // uni.navigateTo({
|
|
|
+ // url: path
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ isTabBarPage(path) {
|
|
|
+ // 根据你的 tabBar 页面路径进行判断
|
|
|
+ const tabBarPages = ['/pages/study/index', '/pages/study/index', '/pages/study/index', '/pages/my/index'];
|
|
|
+ return tabBarPages.includes(path);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
- .custom-tabbar {
|
|
|
- display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
- /* 其他样式 */
|
|
|
- }
|
|
|
- .tab-item {
|
|
|
- flex: 1;
|
|
|
- /* 样式 */
|
|
|
- }
|
|
|
- .tab-icon {
|
|
|
- /* 图标样式 */
|
|
|
- }
|
|
|
-</style>
|
|
|
+ .custom-tabbar {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ /* 其他样式 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-item {
|
|
|
+ flex: 1;
|
|
|
+ /* 样式 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-icon {
|
|
|
+ /* 图标样式 */
|
|
|
+ }
|
|
|
+</style>
|