blackteay/Vue3-Vite-Vant-TS-H5
1
0
Fork 0
mirror of https://github.com/talktao/Vue3-Vite-Vant-TS-H5.git synced 2025-04-06 03:57:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

chroe：使用RequestLoading组件

Browse Source
This commit is contained in:
tantao 2022-08-25 14:44:58 +08:00
parent 17ade1be2c
commit cf2924f075
1 changed files with 36 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
src/layout/index.vue
View File

@ -1,50 +1,49 @@
<script setup lang="ts">
import { ref, reactive, toRefs } from 'vue'
import { ref, reactive, toRefs } from "vue";
//底部tab栏相关
const useTabBar = () => {
const state = reactive({
tabBar: [
{
title: '首页',
to: {
name: 'Home'
},
icon: 'home-o'
},
{
title: '我',
to: {
name:'About'
},
icon: 'user-o'
}
]
})
return toRefs(state)
}
const { tabBar } = useTabBar()
const state = reactive({
tabBar: [
{
title: "首页",
to: {
name: "Home",
},
icon: "home-o",
},
{
title: "我",
to: {
name: "About",
},
icon: "user-o",
},
],
});
return toRefs(state);
};
const { tabBar } = useTabBar();
const handleChange = (value) => {
// console.log(value,'valueeeeeee');
}
// console.log(value,'valueeeeeee');
};
</script>
<template>
<div class="app-container">
<div class="layout-content">
<keep-alive v-if="$route.meta.keepAlive">
<router-view></router-view>
</keep-alive>
<router-view v-else></router-view>
</div>
<div class="layout-footer">
<TabBar :data="tabBar" @chang="handleChange"></TabBar>
</div>
</div>
<div class="app-container">
<div class="layout-content">
<keep-alive v-if="$route.meta.keepAlive">
<router-view></router-view>
</keep-alive>
<router-view v-else></router-view>
<RequestLoading></RequestLoading>
</div>
<div class="layout-footer">
<TabBar :data="tabBar" @chang="handleChange"></TabBar>
</div>
</div>
</template>
<style lang="scss" scoped>
</style>