|
|
@@ -0,0 +1,73 @@
|
|
|
+<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,index)"
|
|
|
+ :style="{ backgroundImage: 'url(' + (currentTab == index ? item.activePath : item.iconPath) + ')' }">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ useTabBarHistory
|
|
|
+ } from '@/utils/emitEvents.js';
|
|
|
+ import cacheManager from "@/utils/cacheManager.js";
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tabList: [{
|
|
|
+ iconPath: 'static/images/tabbar/unselect/plan-sj.png',
|
|
|
+ activePath: 'static/images/tabbar/select/plan-sj.png',
|
|
|
+ path: `/pages/study/index`
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: 'static/images/tabbar/unselect/partner-sj.png',
|
|
|
+ activePath: 'static/images/tabbar/select/partner-sj.png',
|
|
|
+ path: '/pages/game/index'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ iconPath: 'static/images/tabbar/unselect/my-sj.png',
|
|
|
+ activePath: 'static/images/tabbar/select/my-sj.png',
|
|
|
+ path: `/pages/my/index`
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ currentTab: 0,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ switchTab(path, index) {
|
|
|
+ uni.redirectTo({url: path});
|
|
|
+ /* uni.navigateTo({
|
|
|
+ url: path,
|
|
|
+ "animationType": "fade-in",
|
|
|
+ "animationDuration":0
|
|
|
+ }); */
|
|
|
+ },
|
|
|
+
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ this.currentTab =this.currentTabNumber
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .custom-tabbar {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ /* 其他样式 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-item {
|
|
|
+ flex: 1;
|
|
|
+ /* 样式 */
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-icon {
|
|
|
+ /* 图标样式 */
|
|
|
+ }
|
|
|
+</style>
|
wangxy