HoshinoSuzumi
ceb9636b42
- 添加pinia状态管理库和Tabbar组件 - 引入axios和fant-axios-adapter - 在main.ts中使用pinia和persist插件 - 在App.vue中修改标题 - 在useUser.ts中添加logout方法 - 添加persist.ts文件 - 修改page-wrapper.vue和TabBar.vue中的代码 - 修改index.vue和login.vue中的代码
62 lines
1.4 KiB
Vue
62 lines
1.4 KiB
Vue
<script lang="ts" setup>
|
|
import { nextTick, ref } from 'vue';
|
|
import { useRouter, useRoute } from 'uni-mini-router'
|
|
import { onMounted, computed, watch } from 'vue';
|
|
import { useTabbar } from '@/stores/useTabbar';
|
|
|
|
const props = defineProps({
|
|
currentName: {
|
|
type: String,
|
|
default: 'home'
|
|
}
|
|
})
|
|
|
|
const router = useRouter()
|
|
const tab = useTabbar()
|
|
|
|
// const isFirstTime = ref(true)
|
|
|
|
// onMounted(() => {
|
|
// if (isFirstTime.value) {
|
|
// tab.activeTab = props.currentName
|
|
// isFirstTime.value = false
|
|
// }
|
|
// })
|
|
|
|
const tabWhitelist = ['home', 'progress', 'my']
|
|
|
|
const nameLabelIconMap = {
|
|
home: {
|
|
title: '进度查看',
|
|
icon: 'dashboard'
|
|
},
|
|
progress: {
|
|
title: '进度管理',
|
|
icon: 'transfer'
|
|
},
|
|
my: {
|
|
title: '我的',
|
|
icon: 'user'
|
|
}
|
|
}
|
|
|
|
const tabList = computed(() => router.routes.filter((r: { name: string }) => tabWhitelist.includes(r.name)).map((route: { name: keyof typeof nameLabelIconMap }) => {
|
|
return {
|
|
name: route.name,
|
|
title: nameLabelIconMap[route.name]?.title,
|
|
icon: nameLabelIconMap[route.name]?.icon
|
|
}
|
|
}))
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<wd-tabbar v-model="tab.activeTab" fixed safe-area-inset-bottom bordered placeholder>
|
|
<wd-tabbar-item v-for="(tab, i) in tabList" :name="tab.name" :title="tab.title" :icon="tab.icon" :key="i"
|
|
@tap="router.pushTab({ name: tab.name })" />
|
|
</wd-tabbar>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|