diff --git a/node_modules/.cache/eslint/7dc60d80.json b/node_modules/.cache/eslint/7dc60d80.json
new file mode 100644
index 00000000..743a29b2
--- /dev/null
+++ b/node_modules/.cache/eslint/7dc60d80.json
@@ -0,0 +1 @@
+[{"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js":"1","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue":"2","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js":"3","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue":"4","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue":"5","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue":"6","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue":"7","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue":"8","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue":"9","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue":"10","D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue":"11"},{"size":261,"mtime":1731506523733,"results":"12","hashOfConfig":"13"},{"size":97,"mtime":1731506523731,"results":"14","hashOfConfig":"13"},{"size":1052,"mtime":1731513557777,"results":"15","hashOfConfig":"13"},{"size":359,"mtime":1731741182777,"results":"16","hashOfConfig":"13"},{"size":2643,"mtime":1731566073424,"results":"17","hashOfConfig":"13"},{"size":919,"mtime":1731566064122,"results":"18","hashOfConfig":"13"},{"size":161,"mtime":1731508571798,"results":"19","hashOfConfig":"13"},{"size":156,"mtime":1731511731213,"results":"20","hashOfConfig":"13"},{"size":155,"mtime":1731512433247,"results":"21","hashOfConfig":"13"},{"size":157,"mtime":1731512507547,"results":"22","hashOfConfig":"13"},{"size":14422,"mtime":1731741182778,"results":"23","hashOfConfig":"13"},{"filePath":"24","messages":"25","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},"10795if",{"filePath":"27","messages":"28","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"30","messages":"31","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"26"},{"filePath":"32","messages":"33","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"34","messages":"35","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"36","messages":"37","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"38","messages":"39","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"40","messages":"41","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"42","messages":"43","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"44","messages":"45","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"29"},{"filePath":"46","messages":"47","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\main.js",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\App.vue",[],[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\router\\index.js",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\Main.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\header.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\components\\background.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\recommend\\index.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\chat\\chat.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\community\\trends.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\space\\space.vue",[],"D:\\我的桌面\\恋爱森林\\dazuoye\\src\\views\\login\\login.vue",[]]
diff --git a/src/assets/css/community/community.css b/src/assets/css/community/community.css
new file mode 100644
index 00000000..c0ef566d
--- /dev/null
+++ b/src/assets/css/community/community.css
@@ -0,0 +1,80 @@
+
+.base
+{
+  height: 100vh;
+  background-image: url("../../pictures/communityback.png");
+  background-size: 90%;
+  background-attachment: fixed;  /* 背景固定 */
+  background-position: -600px; /* 向左移动背景图像 50px */
+  background-position: center;  /* 可以选择让背景居中 */
+  z-index: -1; 
+}
+.touxiang
+{
+  position: absolute;
+  top:50%;
+  left:5%;
+  border-radius: 10px;
+  width: 50px;
+  height:50px;
+  transform: translateY(-50%)
+}
+.leftinfo
+{
+      background-color: rgba(255,255,255,0.8);
+      width: 15%;
+      position: fixed;
+      left:0%;
+      border: 3px solid  orchid;
+      height:100%;
+        
+}
+.rightheat
+{
+
+    background-color: rgba(255,255,255,0.8);
+    position: fixed;
+    right:0%;
+    width: 15%;
+    border: 3px solid  orchid;
+    height:100%;
+    
+}
+.familytitle
+{
+  position: absolute;
+  top:8%;
+  left:35%;
+  font-size: 14px;
+  font-weight: bold; 
+
+}
+.familycontent
+{
+  position: absolute;
+  bottom:12%;
+  left:35%;
+  font-size: 13px;
+
+}
+.Hotsearchnum{
+    border-radius: 50%;
+    width: 25px;
+    height: 25px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+.middle
+{
+  position: absolute;
+  left:50%;
+  transform: translateX(-50%);
+  width: 65%;
+  border: 3px solid  orchid;
+  height:100%;
+  z-index:1;
+}
+.post-list {
+   
+  }
diff --git a/新建文件夹/package-lock.json b/新建文件夹/package-lock.json
index 949a1df7..a0b1e76b 100644
--- a/新建文件夹/package-lock.json
+++ b/新建文件夹/package-lock.json
@@ -4184,6 +4184,12 @@
         "ajv": "^6.9.1"
       }
     },
+    "node_modules/animate.css": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmmirror.com/animate.css/-/animate.css-4.1.1.tgz",
+      "integrity": "sha512-+mRmCTv6SbCmtYJCN4faJMNFVNN5EuCTTprDTAo7YzIGji2KADmakjVA3+8mVDkZ2Bf09vayB35lSQIex2+QaQ==",
+      "license": "MIT"
+    },
     "node_modules/ansi-colors": {
       "version": "4.1.3",
       "resolved": "https://registry.npmmirror.com/ansi-colors/-/ansi-colors-4.1.3.tgz",
diff --git a/新建文件夹/src/App.vue b/新建文件夹/src/App.vue
index 83ffa537..837c15cf 100644
--- a/新建文件夹/src/App.vue
+++ b/新建文件夹/src/App.vue
@@ -1,6 +1,7 @@
 <template>
-  
-  <RouterView />
+
+	<router-view/>
+
 </template>
 
 <script setup></script>
diff --git a/新建文件夹/src/assets/pictures/communityback.png b/新建文件夹/src/assets/pictures/communityback.png
new file mode 100644
index 00000000..2bf72596
Binary files /dev/null and b/新建文件夹/src/assets/pictures/communityback.png differ
diff --git a/新建文件夹/src/assets/pictures/touxiang.png b/新建文件夹/src/assets/pictures/touxiang.png
new file mode 100644
index 00000000..0ff1e8cc
Binary files /dev/null and b/新建文件夹/src/assets/pictures/touxiang.png differ
diff --git a/新建文件夹/src/components/CommentInput.vue b/新建文件夹/src/components/CommentInput.vue
new file mode 100644
index 00000000..c4805c2e
--- /dev/null
+++ b/新建文件夹/src/components/CommentInput.vue
@@ -0,0 +1,57 @@
+<template>
+    <div class="comment-input">
+      <textarea v-model="commentText" placeholder="输入评论..." rows="3"></textarea>
+      <button @click="submitComment">发布评论</button>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    data() {
+      return {
+        commentText: '',  // 存储用户输入的评论
+      };
+    },
+    methods: {
+      submitComment() {
+        if (this.commentText.trim()) {
+          this.$emit('submitComment', this.commentText);  // 向父组件传递评论文本
+          this.commentText = '';  // 清空输入框
+          this.$emit('updateLikeCount', this.likeCount + 1);
+        } else {
+          alert("评论不能为空！");
+        }
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+  .comment-input {
+    display: flex;
+    flex-direction: column;
+  }
+  
+  textarea {
+    margin-bottom: 10px;
+    padding: 10px;
+    font-size: 14px;
+    border-radius: 5px;
+    border: 1px solid #ddd;
+  }
+  
+  button {
+    align-self: flex-end;
+    padding: 8px 15px;
+    background-color: #007bff;
+    color: white;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+  }
+  
+  button:hover {
+    background-color: #0056b3;
+  }
+  </style>
+  
\ No newline at end of file
diff --git a/新建文件夹/src/components/PostCard.vue b/新建文件夹/src/components/PostCard.vue
new file mode 100644
index 00000000..0b2a69fa
--- /dev/null
+++ b/新建文件夹/src/components/PostCard.vue
@@ -0,0 +1,173 @@
+<template>
+    <div class="post-card">
+      <div class="post-header">
+        <img :src="avatarUrl" alt="avatar" class="avatar" />
+        <div class="user-info">
+          <strong>{{ username }}</strong>
+          <span>{{ timestamp }}</span>
+        </div>
+      </div>
+      <div class="post-content">
+        <p>{{ content }}</p>
+          <div style="display: flex;justify-content: center;">
+          <img v-if="imageUrl" :src="imageUrl" alt="post image" />
+          </div>
+      </div>
+      <div class="post-footer">
+        <button @click="increaseLikeCount" :class="{'liked': isLiked}">
+          <span v-if="isLiked">❤️</span>
+          <span v-else>🤍</span> 
+          {{ likeCount }}
+        </button>
+       
+        <button @click="toggleCommentsVisibility">
+          {{ isCommentsVisible ? '隐藏评论' : '查看评论' }}
+          💬
+          {{ commentCount }}
+        </button>
+      </div>
+  
+      <!-- 评论区的过渡动画 -->
+      <transition name="fade" @before-enter="beforeEnter" @enter="enter" @leave="leave">
+        <div v-if="isCommentsVisible" class="comments-section">
+          <div v-for="(comment, index) in comments" :key="index" class="comment">
+            <p><strong>{{ comment.username }}:</strong> {{ comment.text }}</p>
+          </div>
+  
+          <!-- 发布评论 -->
+          <CommentInput @submitComment="addComment" />
+        </div>
+      </transition>
+    </div>
+  </template>
+  
+  <script>
+  import CommentInput from './CommentInput.vue';
+  
+  export default {
+    components: { CommentInput },
+    props: {
+      avatarUrl: String,
+      username: String,
+      timestamp: String,
+      content: String,
+      imageUrl: String,
+      likeCount: Number,
+      commentCount: Number,
+      isCommentsVisible: Boolean,
+      comments: Array,  // 接收评论列表
+    },
+    methods: {
+      increaseLikeCount() {
+        this.$emit('updateLikeCount', this.likeCount + 1);
+        this.isLiked = !this.isLiked;
+      },
+      increaseCommentCount() {
+        this.$emit('updateCommentCount', this.commentCount + 1);
+      },
+      toggleCommentsVisibility() {
+        this.$emit('toggleCommentsVisibility');
+      },
+      addComment(commentText) {
+        this.$emit('addComment', commentText);  // 向父组件传递评论
+      },
+      beforeEnter(el) {
+        el.style.maxHeight = '0';
+      },
+      enter(el, done) {
+        el.offsetHeight;  // 强制触发浏览器重排
+        el.style.transition = 'max-height 0.3s ease-in-out';
+        el.style.maxHeight = `${el.scrollHeight}px`;
+        done();
+      },
+      leave(el, done) {
+        el.style.transition = 'max-height 0.3s ease-in-out';
+        el.style.maxHeight = '0';
+        done();
+      }
+    }
+  };
+  </script>
+  
+  <style scoped>
+button {
+    background: none;
+    border: none;
+    font-size: 1rem;
+    cursor: pointer;
+    outline: none;
+    padding: 0;
+  }
+
+/* 点赞后的红色样式 */
+@keyframes scaleAnimation {
+  0% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.2);
+  }
+  100% {
+    transform: scale(1);
+  }
+}
+
+/* .liked 类，应用动画 */
+.liked {
+  color: red;
+  animation: scaleAnimation 0.5s ease-in-out;
+}
+
+  .post-card {
+    opacity: 0.95;
+    margin: 20px;
+    border: 1px solid #ddd;
+    padding: 15px;
+    border-radius: 8px;
+    background-color: #fff;
+  }
+  
+  .post-header {
+    display: flex;
+    align-items: center;
+  }
+  
+  .avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    margin-right: 10px;
+  }
+  
+  .user-info {
+    font-size: 14px;
+  }
+  
+  .post-footer {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 10px;
+  }
+  
+  .comments-section {
+    margin-top: 15px;
+    padding: 10px;
+    background-color: #f9f9f9;
+    border-radius: 8px;
+    overflow: hidden;  /* 确保在 max-height 动画过程中隐藏溢出的内容 */
+  }
+  
+  .comment {
+    margin-bottom: 10px;
+  }
+  
+  /* 过渡效果 */
+  .fade-enter-active, .fade-leave-active {
+    transition: max-height 0.3s ease-in-out;
+  }
+  .fade-enter, .fade-leave-to {
+    max-height: 0;
+  }
+  </style>
+
+  
\ No newline at end of file
diff --git a/新建文件夹/src/components/header.vue b/新建文件夹/src/components/header.vue
index 939e0e40..90397327 100644
--- a/新建文件夹/src/components/header.vue
+++ b/新建文件夹/src/components/header.vue
@@ -9,7 +9,7 @@
       active-text-color="#FEB2D7"
     >
     <div class="logo">
-      <img src="@/assets/pictures/Logo.png" alt="Logo" />
+      <img src="../assets/pictures/Logo.png" alt="Logo" />
     </div>
       <el-menu-item index="1">智能推荐</el-menu-item>
       <el-sub-menu index="2">
@@ -56,12 +56,11 @@
   })
 </script>
 <script>
-  export default 
-  {
-    name: 'HeaderComponent', // 添加组件名称
-    // 其他组件选项
-  }
-</script>
+  export default {
+   name: 'HeaderComponent',
+ }
+ 
+ </script>
 
 <style>
 .el-menu-demo {
diff --git a/新建文件夹/src/main.js b/新建文件夹/src/main.js
index 2e37baf6..1422671b 100644
--- a/新建文件夹/src/main.js
+++ b/新建文件夹/src/main.js
@@ -3,9 +3,12 @@ import App from './App.vue'
 import router from './router'
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 
 const app = createApp(App)
-
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+    app.component(key, component)
+  }
 app.use(ElementPlus)
 app.use(router)
 app.mount('#app')
diff --git a/新建文件夹/src/router/index.js b/新建文件夹/src/router/index.js
index 24f9fa1b..b773f897 100644
--- a/新建文件夹/src/router/index.js
+++ b/新建文件夹/src/router/index.js
@@ -11,6 +11,7 @@ import {createRouter ,createWebHashHistory} from 'vue-router'
 const routes = [
     {
         path : '/',
+        
         component : login
     },
     {
diff --git a/新建文件夹/src/views/Main.vue b/新建文件夹/src/views/Main.vue
index 8c434a3d..ee2c497b 100644
--- a/新建文件夹/src/views/Main.vue
+++ b/新建文件夹/src/views/Main.vue
@@ -5,7 +5,7 @@
   <RouterView />
  </div>      
           
-    
+ <router-view/>  
     
     
 </template>
@@ -15,6 +15,7 @@
   import heade from '../components/header.vue'
   // import background from '../components/background.vue'
 </script>
+
 <script>
   
     export default {
diff --git a/新建文件夹/src/views/community/trends.vue b/新建文件夹/src/views/community/trends.vue
index 90618980..1b01c8f5 100644
--- a/新建文件夹/src/views/community/trends.vue
+++ b/新建文件夹/src/views/community/trends.vue
@@ -1,9 +1,164 @@
 <template>
-  社区动态
+  <div class=base>
+    
+    <div class=leftinfo>
+        <div class=focus style="position: absolute; font-weight: bold; font-size: 18px; left:8%;top:1%">
+        你的关注
+        </div>
+        <div class=num style="position:absolute;  font-size: 14px; right:20%; top:1.5%; color: #45D4CF;">
+          {{myfollows.weidu}}条新动态
+          </div>
+          <div class=followslist style="position:absolute;display: flex;flex-direction: column;top:7%;width:100%;gap:7%">
+            <div>
+              <div class= "alldongtai" style="display: flex; flex-direction: row;justify-content:center;  position: relative; align-items: center;">
+                <el-icon color="#45D4CF" size="30px"> <Grid /></el-icon>
+                <div style="margin-left: 40px; font-weight: bold; font-size: 16px;">全部动态</div>
+              </div>
+              <hr style="width: 100%; height: 0.001px; background-color: #D8D8D8;margin-top: 3%;">
+            </div>
+            <div v-for="(follow, index) in myfollows.list" :key="index" style="margin-top: 8%;">
+              <div class="follows" style="display: flex; flex-direction: row; justify-content: center; align-items: center; position: relative;width: 100%;">
+                <img class="touxiang" src="../../assets/pictures/touxiang.png" style="width: 18%; height: auto;" />
+                <div style="margin-left: 40px; font-weight: bold; font-size: 16px;">{{ follow.name }}</div>
+              </div>
+              <hr style="width: 100%; height: 0.001px; background-color: #D8D8D8; margin-top: 5%;">
+            </div>
+            
+            
+          </div>
+    </div>
+    <div class=middle>
+        
+          <div class="post-list">
+            <div
+              v-for="(post, index) in posts"
+              :key="index"
+              class="post-card"
+            >
+              <PostCard
+                :avatarUrl="post.avatarUrl"
+                :username="post.username"
+                :timestamp="post.timestamp"
+                :content="post.content"
+                :imageUrl="post.imageUrl"
+                :likeCount="post.likeCount"
+                :commentCount="post.commentCount"
+                :isCommentsVisible="post.isCommentsVisible"
+                :comments="post.comments"
+                @updateLikeCount="updateLikeCount(index, $event)"
+                @updateCommentCount="updateCommentCount(index, $event)"
+                @toggleCommentsVisibility="toggleCommentsVisibility(index)"
+                @addComment="addComment(index, $event)"
+              />
+            </div>
+          </div>
+      
+      
+    </div>
+    <div class=rightheat style="display: flex;flex-direction:column;">
+
+      <div style="position:relative; top:1%; display: flex;flex-direction:row;justify-content:center;gap:15px">
+        <el-icon color="red" size="30px"><Odometer /></el-icon>
+        <div style="font-weight:550; font-size: 18px;">热门动态</div>
+      </div>
+     <div class= heatlist style="margin-top:20px;display: flex;flex-direction:row;">
+        <div style="position:relative; display: flex;flex-direction:column;  color: white; font-weight: bold;margin-left: 20px ;gap:11px">
+            <div class=Hotsearchnum style="background-color:red;">1</div>
+            <div class=Hotsearchnum style="background-color:#FF7E38;">2</div>
+            <div class=Hotsearchnum style="background-color:#FFC74F;">3</div>
+            <div class=Hotsearchnum style="background-color:gray;">4</div>
+            <div class=Hotsearchnum style="background-color:gray;">5</div>
+            <div class=Hotsearchnum style="background-color:gray;">6</div>
+            <div class=Hotsearchnum style="background-color:gray;">7</div>
+        </div>
+        <div style=" font-size: 14px;font-weight:500;margin-left: 30px;display: flex;flex-direction:column;gap:17px">
+          <li style="list-style-type: none;" v-for="(item, index) in HotsearchList" :key="index">{{ item }}</li>
+        </div>
+        
+      </div>
+      <div style="width: 100%; height: 1px; background: linear-gradient(to right, transparent, gray, transparent);margin-top: 20px"></div>
+      <div style="position:relative; top:1%; display: flex;flex-direction:row;justify-content:center;gap:15px">
+        <el-icon color="#FEB7D9" size="25px"><Notebook /></el-icon>
+        <div style="font-weight:550; font-size: 18px;">热门家族故事</div>
+      </div>
+      <div class="familystorelist" style="margin-top: 20px; display: flex; justify-content: center; flex-direction: column; gap: 10px;">
+        <div v-for="(story, index) in familystories" :key="index" class="familystore" style="width: 95%; height: 70px; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative;">
+          <img class="touxiang" src="../../assets/pictures/touxiang.png" />
+          <div class="familytitle">{{ story.title }}</div>
+          <div class="familycontent">{{ story.content }}</div>
+        </div>
+      </div>
+      
+      
+    </div>
+
+  </div>
+  
 </template>
+<style>
+  @import url('../../assets/css/community/community.css');
+  </style>
 <script>
+import PostCard from '../../components/PostCard.vue';
 export default {
   name: 'CommunityIndex', // 添加组件名称
+  components: { PostCard },
   // 其他组件选项
+  data() {
+    return {
+      isLiked: false, 
+      HotsearchList: ["麦琳爱吃烧鸡","马思唯收官战","国足绝杀","再见爱人","杨子黄圣依","黄磊的豆角","邪恶栀子花计划"],
+      familystories: [
+      { title: '我是怎么起家的', content: '我的父母来自于印度，后面通过自己的打拼...' },
+      { title: '我的祖父', content: '我的祖父曾经参加过二战，有一次在诺曼底...' },
+      { title: '我竟然是皇室成员！', content: '在我的18岁生日上，妈妈告诉我祖母其实是...' },
+      
+
+    ],
+    myfollows:{weidu:7,list:[{name:'乔一鱼'},{name:'邓紫棋'},{name:'马思唯'},{name:'陶喆'}]},
+    posts: [
+          {
+            avatarUrl: 'https://via.placeholder.com/40',
+            username: '小明',
+            timestamp: '1小时前',
+            content: '今天的天气真好，适合出去玩！',
+            imageUrl: 'https://via.placeholder.com/400x200',
+            likeCount: 24,
+            commentCount: 6,
+            isCommentsVisible: false,
+            comments: []  // 存储评论
+          },
+          {
+            avatarUrl: 'https://via.placeholder.com/40',
+            username: '小红',
+            timestamp: '2小时前',
+            content: '刚看完一场电影，真是太感人了！',
+            imageUrl: '',
+            likeCount: 36,
+            commentCount: 12,
+            isCommentsVisible: false,
+            comments: []  // 存储评论
+          },
+        ]
+    };
+  },
+  methods: {
+      updateLikeCount(index, newLikeCount) {
+        this.posts[index].likeCount = newLikeCount;
+      },
+      updateCommentCount(index, newCommentCount) {
+        this.posts[index].commentCount = newCommentCount;
+      },
+      toggleCommentsVisibility(index) {
+        this.posts[index].isCommentsVisible = !this.posts[index].isCommentsVisible;
+      },
+      addComment(index, commentText) {
+        this.posts[index].comments.push({
+          username: '匿名用户',
+          text: commentText
+        });
+        this.posts[index].commentCount += 1;
+      }
+    }
 }
 </script>
\ No newline at end of file
diff --git a/新建文件夹/src/views/space/space.vue b/新建文件夹/src/views/space/space.vue
index d33f715b..519f561b 100644
--- a/新建文件夹/src/views/space/space.vue
+++ b/新建文件夹/src/views/space/space.vue
@@ -1,9 +1,9 @@
 <template>
-    个人空间
+  个人空间
 </template>
 <script>
 export default {
-    name: 'spaceIndex', // 添加组件名称
-    // 其他组件选项
+  name: 'spaceIndex', // 添加组件名称
+  // 其他组件选项
 }
 </script>
\ No newline at end of file