48 lines
1.0 KiB
Vue
48 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted, onUnmounted, watch, nextTick } from 'vue'
|
|
import { useRoute } from 'vitepress'
|
|
import Header from './components/Header.vue'
|
|
import Footer from './components/Footer.vue'
|
|
import FloatingService from './components/FloatingService.vue'
|
|
import { Content } from 'vitepress'
|
|
|
|
const isScrolled = ref(false)
|
|
const route = useRoute()
|
|
|
|
const handleScroll = () => {
|
|
isScrolled.value = window.scrollY > 20
|
|
}
|
|
|
|
onMounted(() => {
|
|
handleScroll()
|
|
window.addEventListener('scroll', handleScroll)
|
|
})
|
|
|
|
onUnmounted(() => {
|
|
window.removeEventListener('scroll', handleScroll)
|
|
})
|
|
|
|
// 路由切换后滚动到顶部
|
|
watch(
|
|
() => route.path,
|
|
() => {
|
|
nextTick(() => {
|
|
window.scrollTo({ top: 0, behavior: 'smooth' })
|
|
})
|
|
}
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="font-sans antialiased text-apple-dark bg-white min-h-screen flex flex-col relative">
|
|
<Header :scrolled="isScrolled" />
|
|
|
|
<main class="flex-grow">
|
|
<Content />
|
|
</main>
|
|
|
|
<Footer />
|
|
<FloatingService />
|
|
</div>
|
|
</template>
|