diff --git a/src/assets/css/community/community.css b/src/assets/css/community/community.css
index ee93ecf4..4249fe2c 100644
--- a/src/assets/css/community/community.css
+++ b/src/assets/css/community/community.css
@@ -33,25 +33,25 @@
 
 
 
-.communitybase
-{
-  height: 100vh;
+.communitybase {
+  position: relative;
+  height: 93.5vh;
   background-image: url("../../pictures/communityback.png");
-  background-size: 90%;
+  background-size: cover;  /* 适应整个屏幕 */
   background-attachment: fixed;  /* 背景固定 */
-  background-position: -600px; /* 向左移动背景图像 50px */
-  background-position: center;  /* 可以选择让背景居中 */
-  z-index: -1; 
+  background-position: center;  /* 背景居中 */
+  z-index: 3;
+  overflow: hidden;  /* 防止滚动时内容溢出 */
 }
 .touxiang
 {
   position: absolute;
-  top:50%;
+  top:12%;
   left:5%;
   border-radius: 10px;
   width: 50px;
   height:50px;
-  transform: translateY(-50%)
+ 
 }
 .leftinfo
 {
@@ -85,11 +85,13 @@
 }
 .familycontent
 {
+  width: 50%;
+  height: 50%; 
   position: absolute;
   bottom:12%;
   left:35%;
   font-size: 13px;
-
+  overflow: hidden; /* 隐藏超出部分 */
 }
 .Hotsearchnum{
     border-radius: 50%;
@@ -107,6 +109,13 @@
   width: 65%;
   height:100%;
   z-index:1;
+  height: 100%;  /* 占据父容器高度 */
+  overflow-y: auto;  /* 允许垂直滚动 */
+}
+/* 隐藏滚动条 */
+.middle::-webkit-scrollbar {
+  width: 0px;  /* 隐藏水平滚动条 */
+  height: 0px; /* 隐藏垂直滚动条 */
 }
 .follows {
   cursor: pointer;
@@ -114,12 +123,12 @@
 }
 
 .follows:hover {
-  background-color: #d0d0d0;  
+  background-color: #FEB2D7;  
 }
 .follows.selected {
-  background-color: rgba(255,255,255,0.8);  
+  background-color:rgba(255, 225, 240, 0.7);  
   font-weight: bold;  
-  color: orchid;  
+ 
 }
 .alldongtai:hover{
   background-color: #d0d0d0;  
diff --git a/src/components/CommentInput.vue b/src/components/CommentInput.vue
index c4805c2e..5fd89e13 100644
--- a/src/components/CommentInput.vue
+++ b/src/components/CommentInput.vue
@@ -43,7 +43,7 @@
   button {
     align-self: flex-end;
     padding: 8px 15px;
-    background-color: #007bff;
+    background-color: #FE4E96;
     color: white;
     border: none;
     border-radius: 5px;
@@ -51,7 +51,7 @@
   }
   
   button:hover {
-    background-color: #0056b3;
+    background-color: #FEB2D7;
   }
   </style>
   
\ No newline at end of file
diff --git a/src/components/PostCard.vue b/src/components/PostCard.vue
index c99fa2d5..7ec46703 100644
--- a/src/components/PostCard.vue
+++ b/src/components/PostCard.vue
@@ -16,12 +16,21 @@
         </button>
 
         <span>{{ timestamp }}</span>
+        
+        
+        
       </div>
+      <div v-if="isfamilystory" class="ribbon-8">
+          <span>
+              家族故事
+          </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" />
+        <img class="postimage" v-if="imageUrl" :src="imageUrl" alt="post image" />
       </div>
     </div>
     <div class="post-footer">
@@ -66,6 +75,7 @@
       likeCount: Number,
       commentCount: Number,
       isCommentsVisible: Boolean,
+      isfamilystory:Boolean,
       comments: Array,  // 接收评论列表
     },
     data() {
@@ -127,6 +137,31 @@
 </script>
 
 <style scoped>
+  .postimage{
+    max-width: 600px;
+  max-height: 600px;
+  width: auto; /* 保持宽高比 */
+  height: auto; /* 保持宽高比 */
+}
+  .ribbon-8 {
+    position:absolute;
+    right:-2%;
+    padding: 2px 10px;
+    width: 10%;
+    background-color: #FE4E96;
+    font-size: 15px;
+    color: #fff;
+  }
+
+  .ribbon-8::before {
+    content: "";
+    position: absolute;
+    right: 0;
+    bottom: -4px;
+    border-top: 4px solid #FE4E96;
+    border-right: 4px solid transparent;
+  }
+
   button {
     background: none;
     border: none;
@@ -211,6 +246,7 @@
   }
 
   .post-header {
+    position: relative;
     display: flex;
     align-items: center;
   }
diff --git a/src/views/community/Postform.vue b/src/views/community/Postform.vue
index 21ffd55e..5ae06d48 100644
--- a/src/views/community/Postform.vue
+++ b/src/views/community/Postform.vue
@@ -24,8 +24,9 @@
 
       
           <div>
-            <el-upload action="#" list-type="picture" :auto-upload="false" :limit="1" :on-exceed="handleExceed"
-              style="position: fixed; left: 12%;display: flex; align-items: center;" >
+            <el-upload action="#" list-type="picture" :auto-upload="false" :limit="1" :on-exceed="handleExceed" ref="postimage"
+              style="position: fixed; left: 12%;display: flex; align-items: center;" @change="handleFileChange" >
+              <!-- @success="handleUploadSuccess" -->
                   
               
               <el-icon size="30px">
@@ -44,8 +45,7 @@
           </el-radio-group>
 
           
-        
-         
+    
 
           <div class="button-container">
             <el-button type="primary" @click="submitPost" :disabled="!form.content.trim()"
@@ -73,8 +73,7 @@
     data() {
       return {
         showForm: false,  // 控制表单是否显示
-        radio: '1',
-        radio4:'1',
+        radio: '日常动态',
         form: {
           content: ''
         },
@@ -84,6 +83,13 @@
       };
     },
     methods: {
+      handleFileChange(file) {
+      // 当文件被选中时触发
+      if (file.raw) {
+        // 创建预览图片的URL
+        this.imageUrl = URL.createObjectURL(file.raw);
+      }
+    },
       handleExceed()
       {
         this.$message.error("目前仅支持添加一张图片");
@@ -104,7 +110,9 @@
         return isImage;
       },
       handleUploadSuccess(response, file, fileList) {
+    
         this.imageUrl = URL.createObjectURL(file.raw); // 创建临时 URL 以预览图片
+        this.$message("创建图片"+this.imageUrl);
         this.fileList = fileList;
       },
       handleRemove(file, fileList) {
@@ -112,12 +120,14 @@
         this.fileList = fileList;
       },
       submitPost() {
+        this.$refs.postimage.submit();
         if (!this.form.content.trim()) {
           this.$message.error('内容不能为空');
           return;
         }
         const newPost = {
           postId: Date.now(),
+          userid:1,
           username: '用户',
           avatarUrl: 'https://via.placeholder.com/50',
           timestamp: new Date().toLocaleString(),
@@ -126,8 +136,11 @@
           likeCount: 0,
           commentCount: 0,
           comments: [],
+          isCommentsVisible: false,
+          isfamilystory: this.radio === '家族故事' ? true : false,
           liked: false
         };
+       
         this.$emit('post-submitted', newPost);
         this.form.content = '';
         this.imageUrl = '';
diff --git a/src/views/community/trends.vue b/src/views/community/trends.vue
index 397af28b..f7ca018a 100644
--- a/src/views/community/trends.vue
+++ b/src/views/community/trends.vue
@@ -6,7 +6,7 @@
         你的关注
       </div>
       <div class=num style="position:absolute; font-size: 14px; right:20%; top:1.5%; color: #45D4CF;">
-        {{myfollows.weidu}}条新动态
+        {{ totalWeidu}}条新动态
       </div>
       <div style="top:6%;position: absolute;width: 100%;">
         <div class="alldongtai"
@@ -23,90 +23,103 @@
       <div class=followslist
         style="position:absolute;display: flex;flex-direction: column;top:10%;width:100%;height: 100%;gap:2%; ">
 
-        <div v-for="(follow, index) in myfollows.list" :key="index" style="width: 100%;">
+        <div v-for="(follow, index) in myfollows" :key="index" style="width: 100%;">
           <div class="follows"
-            style="display: flex; flex-direction: row; justify-content: center; align-items: center; position: relative;height: 120%;"
+            style="display: flex; flex-direction: row; justify-content: center; align-items: center; position: relative;height: 120%;gap:3%;width: 100%;"
             @mouseover="hoverIndex = index" @mouseleave="hoverIndex = -1" @click="fllowsClick(follow.userid,index)"
             :class="{'selected': selectedIndex === index}">
             <img class="touxiang" src="../../assets/pictures/touxiang.png" style="left:20%;width: 15%; height: auto;" />
             <div style="margin-left: 40px; font-weight: bold; font-size: 16px;">{{ follow.name }}</div>
+            <el-tag v-if="follow.weidu" effect="plain" round style="position: absolute; right:0%">
+              {{follow.weidu}}条新动态
+            </el-tag>
           </div>
           <hr style="width: 100%; height: 0.001px; background-color: #D8D8D8; margin-top: 1%;">
         </div>
-
+        
 
       </div>
     </div>
 
     <div class="middle">
-      <PostForm @post-submitted="addPost" />
+      <PostForm @post-submitted="submitPost" />
       <div class="post-list">
         <!-- 使用 transition-group 来包裹 v-for 渲染的元素 -->
-        <transition-group name="fade" tag="div">
-          <div v-for="(post, index) in filteredPosts" :key="post.id" 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>
-        </transition-group>
+        <ul v-infinite-scroll="load" class="infinite-list" style="height:100px">
+          <transition-group name="fade" tag="div">
+            <div v-for="(post, index) in checkPosts" :key="post.id" 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"
+                :isfamilystory="post.isfamilystory" @updateLikeCount="updateLikeCount(index, $event)"
+                @updateCommentCount="updateCommentCount(index, $event)"
+                @toggleCommentsVisibility="toggleCommentsVisibility(index)" @addComment="addComment(index, $event)" />
+
+            </div>
+          </transition-group>
+        </ul>
       </div>
-  </div>
+    </div>
 
 
-  <div class=rightheat style="display: flex;flex-direction:column;">
+    <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:51px">
-        <div class=Hotsearchnum style="background-color:red;">1</div>
-        <div class=Hotsearchnum style="background-color:#ff8e51;">2</div>
-        <div class=Hotsearchnum style="background-color:#ffc74fd2;">3</div>
-        <div class=Hotsearchnum style="background-color:gray;">4</div>
-        <div class=Hotsearchnum style="background-color:gray;">5</div>
-      
+      <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 
-  style="font-size: 14px; font-weight: 500; margin-left: 30px; display: flex; flex-direction: column; gap: 17px;">
-  <div  
-    style="list-style-type: none; width: 95%; height: 20%; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative;"
-    v-for="(Hotsearch, index) in HotsearchList" 
-    :key="index"
-    @click="checkbypostid(Hotsearch.postid)">
-    {{ Hotsearch.content }}
-    {{ Hotsearch.postid }}
-  </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:51px">
+          <div class=Hotsearchnum style="background-color:red;">1</div>
+          <div class=Hotsearchnum style="background-color:#ff8e51;">2</div>
+          <div class=Hotsearchnum style="background-color:#ffc74fd2;">3</div>
+          <div class=Hotsearchnum style="background-color:gray;">4</div>
+          <div class=Hotsearchnum style="background-color:gray;">5</div>
+
+        </div>
+        <div
+          style="font-size: 14px; font-weight: 500; margin-left: 30px; display: flex; flex-direction: column; gap: 17px;width: 100%;">
+          <div
+            style="overflow: hidden; list-style-type: none; width: 90%; height: 20%; background-color: rgba(255, 225, 240, 0.7); border-radius: 10%; position: relative; cursor: pointer;"
+            v-for="(Hotsearch, index) in HotsearchList" :key="index" @click="checkbypostid(Hotsearch.postid)">
+            
+            <div style=" font-weight: bold; margin-left: 10%; margin-top: 1%; ">{{ Hotsearch.username }}:</div>
+            <div style="left:10%;width: 70%; font-size: 12px;position: relative;">{{ Hotsearch.content}}</div>
+         
+            <svg width="20" height="20" viewBox="0 0 15 15" xmlns="http://www.w3.org/2000/svg" id="fire-station" style="position: absolute;right:7% ;top:20%;fill:red ">
+              <path d="M7.5 14C11.0899 14 14 11 14 7.50003C14 4.5 11.5 2 11.5 2L10.5 5.5L7.5 1L4.5 5.5L3.5 2C3.5 2 1 4.5 1 7.50003C1 11 3.91015 14 7.5 14ZM7.5 12.5C6.11929 12.5 5 11.3807 5 10C5 8.61929 7.5 5.5 7.5 5.5C7.5 5.5 10 8.61929 10 10C10 11.3807 8.88071 12.5 7.5 12.5Z"/>
+            </svg>
+            <div style="position: absolute;right:7% ;top:60%;font-size: 12px;color: red;">{{Hotsearch.hot}}</div> 
+          </div>
+        </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.username }}</div>
-        <div class="familycontent">{{ story.content }}</div>
       </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;cursor: pointer;"
+          @click="checkbypostid(story.postid)">
+          <img class="touxiang" src="../../assets/pictures/touxiang.png" />
+          <div class="familytitle">{{ story.username }}</div>
+          <div class="familycontent">{{ story.content }}</div>
+        </div>
+      </div>
 
 
-  </div>
+    </div>
 
   </div>
 
@@ -120,26 +133,55 @@
     // 其他组件选项
     data() {
       return {
-        HotsearchList: [{postid: 1,username:"麦琳",content:"啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊", }, 
-        {username:"马思唯",content:"黑马季节收官战无敌", postid: 7,}, 
-         {username:"马思唯",content:"黑马季节收官战无敌", postid: 7,}, {username:"马思唯",content:"黑马季节", postid:7},
-         {username:"马思唯",content:"黑马季hdsajkdhkashjd", postid:3}],
+        HotsearchList: [{ username: "陶喆", postid: 6, content: "啊啊哦哦诶诶啊啊",hot:520 },
+        { avatarUrl: 'https://via.placeholder.com/40', username: "马思唯", content: "黑马季节收官战无敌", postid: 7, hot:220 },
+        { username: "马思唯", content: "我在阿姆斯特丹当个画家虽然口袋里钱不多，就在梵高博物馆外等她从我身边路过", postid: 4,  hot:200}, { username: "马思唯", content: "黑马季节", postid: 1,hot:120  },
+        { username: "马思唯", content: "黑马季hdsajkdhkashjd", postid: 3 ,hot:20 }],
         familystories: [
-          { username: '查理一世', content: '我的父母来自于印度，后面通过自己的打拼...' },
-          { username: '亨利二世', content: '我的祖父曾经参加过二战，有一次在诺曼底...' },
+          { postid: 11, username: '查理一世', content: '我的父母来自于印度，后面通过自己的打拼，他们在异国他乡开创了属于自己的事业，凭借着坚韧不拔的努力和对未来的坚定信念，逐渐改善了我们的生活条件。他们不仅为我们提供了更好的教育和成长环境，还教会了我如何面对挑战、如何珍惜每一个机会。正是他们的奋斗精神和不懈努力，让我明白了无论身处何地，只有不断追求卓越、脚踏实地，才能创造属于自己的未来。' },
+          { postid: 12, username: '亨利二世', content: '我的祖父曾经参加过二战，有一次在诺曼底登陆作战时，他和战友们一同经历了生死考验。那时，战火硝烟弥漫，炮声震天，敌人猛烈的抵抗让每一个前进的步伐都充满了危险。祖父总是告诉我，虽然那是一个充满恐惧与混乱的时刻，但也让他深刻体会到生命的脆弱与坚韧。有一天，他和一队士兵被派遣执行侦察任务，结果遭遇了敌军的伏击。在激烈的交火中，祖父不幸受伤，幸好有战友将他背离险境。在几个月的疗养期里，他经历了痛苦和孤独，但也在那段时间里，祖父重新审视了自己的人生。他常说，那次经历改变了他的一生，让他学会了珍惜每一天，也更懂得什么是真正的勇气与坚守。尽管战争带来了无尽的创伤与损失，但也让他意识到，战争后的重建和和平更加宝贵。回到家乡后，祖父再也没有谈过战争的痛苦，而是投入到了对家庭和社会的贡献中，用余生去弥补那些无法言喻的伤痕。他曾说，虽然战争让人失去了太多，但它也教会了他如何去爱，如何去珍惜每一段相伴的时光。' },
           { username: '查理九世', content: '在我的18岁生日上，妈妈告诉我祖母其实是...' },
           { username: '伊丽莎白', content: '在我的18岁生日上，妈妈告诉我祖母其实是...' },
           { username: '莎士比亚', content: '在我的18岁生日上，妈妈告诉我祖母其实是...' },
-
-
         ],
-        myfollows: { weidu: 7, list: [{ name: '乔一鱼', userid: 1 }, { name: '邓紫棋', userid: 2 }, { name: '马思唯', userid: 3 }, { name: '陶喆', userid: 5 }] },
+        myfollows: [{ name: '乔一鱼', userid: 1, weidu: 1 }, { name: '邓紫棋', userid: 2, weidu: 2 }, { name: '马思唯', userid: 3, weidu: 0 }, { name: '陶喆', userid: 5, weidu: 0 }],
         hoverIndex: -1,
         selectedIndex: -1,
         selecteduserid: 0,
-        selectedbyuserid:false,
-        selectedbypostid:false,
+        selectedpostid: 0,
+        selectedbyuserid: false,
+        selectedbypostid: false,
+        checkPostsindex:0,
+        checkPosts:[ ],
         posts: [
+          {
+            userid: 11,
+            postid: 11,
+            avatarUrl: 'https://via.placeholder.com/40',
+            username: '查理一世',
+            timestamp: '1小时前',
+            isfamilystory: true,
+            content: '我的父母来自于印度，后面通过自己的打拼，他们在异国他乡开创了属于自己的事业，凭借着坚韧不拔的努力和对未来的坚定信念，逐渐改善了我们的生活条件。他们不仅为我们提供了更好的教育和成长环境，还教会了我如何面对挑战、如何珍惜每一个机会。正是他们的奋斗精神和不懈努力，让我明白了无论身处何地，只有不断追求卓越、脚踏实地，才能创造属于自己的未来。',
+            imageUrl: 'https://via.placeholder.com/400x200',
+            likeCount: 24,
+            commentCount: 6,
+            isCommentsVisible: false,
+            comments: []  // 存储评论
+          },
+          {
+            userid: 12,
+            postid: 12,
+            avatarUrl: 'https://via.placeholder.com/40',
+            username: '亨利二世',
+            isfamilystory: true,
+            timestamp: '1小时前',
+            content: '我的祖父曾经参加过二战，有一次在诺曼底登陆作战时，他和战友们一同经历了生死考验。那时，战火硝烟弥漫，炮声震天，敌人猛烈的抵抗让每一个前进的步伐都充满了危险。祖父总是告诉我，虽然那是一个充满恐惧与混乱的时刻，但也让他深刻体会到生命的脆弱与坚韧。有一天，他和一队士兵被派遣执行侦察任务，结果遭遇了敌军的伏击。在激烈的交火中，祖父不幸受伤，幸好有战友将他背离险境。在几个月的疗养期里，他经历了痛苦和孤独，但也在那段时间里，祖父重新审视了自己的人生。他常说，那次经历改变了他的一生，让他学会了珍惜每一天，也更懂得什么是真正的勇气与坚守。尽管战争带来了无尽的创伤与损失，但也让他意识到，战争后的重建和和平更加宝贵。回到家乡后，祖父再也没有谈过战争的痛苦，而是投入到了对家庭和社会的贡献中，用余生去弥补那些无法言喻的伤痕。他曾说，虽然战争让人失去了太多，但它也教会了他如何去爱，如何去珍惜每一段相伴的时光。',
+            imageUrl: 'https://via.placeholder.com/400x200',
+            likeCount: 24,
+            commentCount: 6,
+            isCommentsVisible: false,
+            comments: []  // 存储评论
+          },
           {
             userid: 1,
             postid: 1,
@@ -151,6 +193,7 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
           {
@@ -164,6 +207,7 @@
             likeCount: 36,
             commentCount: 12,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
 
@@ -178,6 +222,7 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
           {
@@ -191,6 +236,7 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
           {
@@ -204,6 +250,7 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
           {
@@ -217,6 +264,7 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
 
@@ -231,65 +279,89 @@
             likeCount: 24,
             commentCount: 6,
             isCommentsVisible: false,
+            isfamilystory: false,
             comments: []  // 存储评论
           },
         ]
       };
     },
     computed: {
+      totalWeidu() {
+      // 使用reduce方法来遍历数组并计算总和
+      return this.myfollows.reduce((sum, item) => sum + item.weidu, 0);
+    },
       // 计算属性：过滤帖子数据，依据 showUser3Posts 的值
       filteredPosts() {
+
         if (this.selectedbyuserid) {
+
           return this.posts.filter(post => post.userid === this.selecteduserid);
         }
-        else if(this.selectedbypostid){
+        if (this.selectedbypostid) {
+
           return this.posts.filter(post => post.postid === this.selectedpostid);
+
+        }
+        else {
+
+          return this.posts;
         }
-        else
-        return this.posts;
-        
       }
     },
     methods: {
-      checkbypostid(postid){
-          // 打印出来检查
-        this.selectedbyuserid =false;
+      submitPost(newpost){
+        this.checkPosts = [newpost, ...this.checkPosts];
+
+      },
+      load(){
+
+        const filteredPostsList = this.posts;
+
+        this.$message("帖子加载");
+        const postsToAdd = filteredPostsList.slice(this.checkPostsindex, this.checkPostsindex + 1);
+        this.checkPostsindex+=1;
+        // 将这 2 个帖子加入到 checkPosts 数组的末尾
+       this.checkPosts.push(...postsToAdd);
+
+      },
+      checkbypostid(postid) {
+
+        this.selectedbyuserid = false;
         this.selectedbypostid = true;
-        console.log('点击事件触发，postid:', this.selectedpostid);
-        this.selectedpostid=postid;
+        this.selectedpostid = postid;
+
       },
       alldongtai() {
         this.selectedbyuserid = false;
-        this.selectedbyuserid =false;
+        this.selectedbypostid = false;
+        this.selectedIndex = -1;
 
-        this.$message("查看全部动态");
       },
 
       fllowsClick(userid, index) {
-        this.$message("查看userid:" + userid);
-
+        this.myfollows[index].weidu = 0;
         this.selectedbyuserid = true;
-
+        this.selectedbypostid = false;
         this.selectedIndex = index;  // 点击后设置选中的项
         this.selecteduserid = userid;
 
       },
       updateLikeCount(index, newLikeCount) {
-        this.filteredPosts[index].likeCount = newLikeCount;
+        this.checkPosts[index].likeCount = newLikeCount;
       },
       updateCommentCount(index, newCommentCount) {
-        this.filteredPosts[index].commentCount = newCommentCount;
+        this.checkPosts[index].commentCount = newCommentCount;
       },
       toggleCommentsVisibility(index) {
-        this.$message("haha" + index);
-        this.filteredPosts[index].isCommentsVisible = !this.filteredPosts[index].isCommentsVisible;
+        this.$message("评论区展开" + index);
+        this.checkPosts[index].isCommentsVisible = !this.checkPosts[index].isCommentsVisible;
       },
       addComment(index, commentText) {
-        this.posts[index].comments.push({
+        this.checkPosts[index].comments.push({
           username: '匿名用户',
           text: commentText
         });
-        this.posts[index].commentCount += 1;
+        this.checkPosts[index].commentCount += 1;
       }
     }
   }