1

client/src/pages/BlogDetail.vue

@@ -81,6 +81,8 @@ const post = ref<Post>({
 const loading = ref(false)
 const error = ref('')
 
+const { initObserver } = useScrollAnimation()
+
 const fetchBlogDetail = async () => {
   loading.value = true
   error.value = ''
@@ -88,6 +90,8 @@ const fetchBlogDetail = async () => {
     const postData = await fetchPost(postId)
     if (postData) {
       post.value = postData
+      // 初始化动画 - 在数据加载完成后
+      initObserver()
     } else {
       error.value = '未找到该文章'
     }
@@ -99,14 +103,8 @@ const fetchBlogDetail = async () => {
   }
 }
 
-onBeforeMount(() => {
-  fetchBlogDetail()
-})
-
 onMounted(() => {
-  // 启用滚动动画
-  useScrollAnimation()
-
+  fetchBlogDetail()
   // 初始化Lucide图标
   if (window.lucide) {
     window.lucide.createIcons()