liveh5-nuxt/app/components/AppHeader.vue

<script setup>
import { useAppHeaderRouteNames as routeWhiteList } from '@/config'
import { liveStore } from "@/stores/live/index.js";
import {goodStore} from "~/stores/goods/index.js";
const { fullLive } = liveStore()
const route = useRoute()
const router = useRouter()
const {auctionDetail} = goodStore();
function onBack() {
  if (fullLive.value){
    fullLive.value=false
    return
  }
  if (window.history.state.back)
    history.back()
  else
    router.replace('/')
}

const { t } = useI18n()

const title = computed(() => {

  if (!route.meta)
    return ''
  return route.meta.i18n ? t(route.meta.i18n) : (route.meta.title || '')
})
const subTitle = computed(() => {
  if (!route.meta)
    return ''
  return route.meta.subTitle ? t(route.meta.subTitle) : ''
})
const showLeftArrow = computed(() => route.name && routeWhiteList.includes(route.name))

</script>

<template>
  <VanNavBar
      v-memo="[title,fullLive,showLeftArrow,subTitle]"
    :title="title"
    :left-arrow="!showLeftArrow||fullLive"
    placeholder clickable fixed
    @click-left="onBack"
  >
    <template #title v-if="route.meta.i18n==='menu.home'">
      <div class="flex flex-col items-center justify-center">
        <div class="text-#000000 text-17px mb-5px font-600">{{ auctionDetail.title }}</div>
      </div>
    </template>
  </VanNavBar>
</template>