karamay/src/App.vue

<script setup>
import TabBar from './components/TabBar.vue'
import { useRoute } from 'vue-router'
import { computed, onMounted } from 'vue'
import { useStore } from 'vuex'

const route = useRoute()
const store = useStore()

// 计算是否显示TabBar
const showTabBar = computed(() => {
  // 在加载页面不显示TabBar
  const paths = ['/loading', '/', '/exhibition', '/collection', '/user', '/indexPage']
  return paths.includes(route.path)
})

// 从store获取isFrom值
const isFrom = computed(() => store.getters.getIsFrom)
// 组件挂载时从URL参数获取isFrom并存储到store
onMounted(() => {
  const hash = window.location.hash
  // 从hash中提取查询参数部分
  const queryIndex = hash.indexOf('?')
  if (queryIndex !== -1) {
    const queryString = hash.substring(queryIndex + 1)
    const urlParams = new URLSearchParams(queryString)
    const isFromParam = urlParams.get('isFrom')
    store.dispatch('setIsFrom', isFromParam)
  } else {
    console.log('No query parameters found', 9999)
    store.dispatch('setIsFrom', null)
  }
})
</script>

<template>
  <RouterView :key="$route.fullPath" />
  <TabBar v-if="showTabBar && isFrom != 'weixin'" />
</template>

<style scoped>
@media (min-width: 1024px) {
  body {
    display: flex;
    place-items: center;
  }
}
</style>