feat:new postdetail

fashion-app/src/app/app.routes.ts

@@ -9,6 +9,10 @@ export const routes: Routes = [
     loadComponent: () =>
       import('./post/post.component').then((m) => m.PostComponent),
   },
+  { path: 'postdetail',
+    loadComponent: () =>
+      import('./post-detail/post-detail.component').then((m) => m.PostDetailComponent),
+  },
   {
     path: '',
     loadChildren: () => import('./tabs/tabs.routes').then((m) => m.routes),

fashion-app/src/app/chat-history/chat-history.component.html

@@ -15,21 +15,20 @@
 </ion-header>
 
 <ion-content>
-  <ion-list >
-    <ion-item *ngFor="let chat of chatHistories; let i = index" fill="clear">
+  <!-- 搜索框 -->
+  <ion-searchbar animated="true" fill="clear" [(ngModel)]="searchDate" (ionInput)="filterChatHistories()" placeholder="输入日期 (YYYY-MM-DD)" class="search"></ion-searchbar>
+  <ion-list>
+    <ion-item *ngFor="let chat of filteredChatHistories; let i = index" fill="clear">
       <div class="chat-item" (click)="selectChatHistory(chat)" [ngClass]="{'first-chat': i === 0}">
         <div class="chat-header">
-
-          <div class="user-info"><!--用户信息-->
-            <img [src]="currentUser.get('image')" alt="User Avatar" class="avatar-image"> <!-- 替换为用户头像的实际路径 -->
-            <span class="username">{{ currentUser.get('username') }}</span> <!-- 假设 chat 对象有 username 字段 -->
+          <div class="user-info">
+            <img [src]="currentUser.get('image')" alt="User Avatar" class="avatar-image">
+            <span class="username">{{ currentUser.get('username') }}</span>
           </div>
-
-            <span class="timestamp">{{ chat.createdAt | date:'yyyy-MM-dd HH:mm' }}</span>
-          
+          <span class="timestamp">{{ chat.createdAt | date:'yyyy-MM-dd HH:mm' }}</span>
         </div>
         <div class="chat-content">
-          <p class="chat-text">{{chat.firstMessage}}</p> <!-- 超出省略 -->
+          <p class="chat-text">{{ chat.firstMessage }}</p>
         </div>
       </div>
     </ion-item>

fashion-app/src/app/chat-history/chat-history.component.scss

@@ -63,4 +63,5 @@
     overflow: hidden; /* 超出部分隐藏 */
     text-overflow: ellipsis; /* 省略号 */
     white-space: nowrap; /* 单行显示 */
-  }
+  }
+

fashion-app/src/app/chat-history/chat-history.component.ts

@@ -1,6 +1,8 @@
 import { CommonModule } from '@angular/common';
 import { Component, OnInit } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { Router } from '@angular/router';
+import { IonSearchbar } from '@ionic/angular/standalone';
 import { IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonContent, IonFooter, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonList, IonTitle, IonToolbar, NavController } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
 import { chevronBackSharp, closeCircleOutline, ellipsisHorizontal, happyOutline, micCircleOutline, paperPlane, sendOutline } from 'ionicons/icons';
@@ -14,7 +16,7 @@ addIcons({ chevronBackSharp,ellipsisHorizontal,micCircleOutline,happyOutline,pap
   styleUrls: ['./chat-history.component.scss'],
   standalone: true,
   imports: [IonHeader,IonToolbar,IonTitle,IonContent,IonList,IonItem,IonLabel,CommonModule,IonCard,IonCardHeader,IonCardTitle,
-    IonButton,IonCardContent,IonIcon,IonButtons,IonInput,IonFooter,IonInput,CommonModule],
+    IonButton,IonCardContent,IonIcon,IonButtons,IonInput,IonFooter,IonInput,CommonModule,IonSearchbar,FormsModule],
 })
 export class ChatHistoryComponent  implements OnInit {
 
@@ -26,6 +28,7 @@ export class ChatHistoryComponent  implements OnInit {
 
   async ngOnInit() {
     await this.loadChatHistories(); // 加载聊天记录
+    this.filteredChatHistories = this.chatHistories; // 初始化过滤后的聊天记录为所有聊天记录
   }
 
   async loadChatHistories() {
@@ -39,16 +42,18 @@ export class ChatHistoryComponent  implements OnInit {
       this.chatHistories = await query.find(); // 获取聊天记录
        // 解析聊天内容并提取每条聊天记录的第一条消息
        this.chatHistories.forEach(chat => {
+        if(chat.data.content){
         chat.parsedContent = JSON.parse(chat.data.content); // 解析内容
         
         chat.firstMessage = chat.parsedContent[0] ? chat.parsedContent[0].text : ''; // 获取第一条消息
-        console.log("hhh", this.chatHistories);
+        //console.log("hhh", this.chatHistories);
+        }
     });
           // 按 createdAt 排序，最近的在前面
     this.chatHistories.sort((a, b) => {
       return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
     });
-      console.log("聊天记录已加载", this.chatHistories);
+      //console.log("聊天记录已加载", this.chatHistories);
     } else {
       console.error("用户未登录，无法加载聊天记录");
     }
@@ -68,7 +73,34 @@ export class ChatHistoryComponent  implements OnInit {
 
   }
 
-  
 
-}
+  searchDate: string = ''; // 搜索日期
+  filteredChatHistories: any[] = []; // 存储过滤后的聊天记录
 
+// 过滤聊天记录
+filterChatHistories() {
+   // 检查用户输入的日期是否有效
+   if (!this.searchDate || this.searchDate.length < 10) {
+    // 如果没有输入完整的日期，显示所有聊天记录
+    this.filteredChatHistories = this.chatHistories;
+    return;
+  }
+  // 解析用户输入的日期
+  const parsedDate = new Date(this.searchDate);
+  
+  // 获取输入日期的开始和结束时间戳
+  const startOfDay = new Date(parsedDate.setHours(0, 0, 0, 0)).getTime(); // 2024-12-24 00:00:00
+  const endOfDay = new Date(parsedDate.setHours(23, 59, 59, 999)).getTime(); // 2024-12-24 23:59:59
+  
+  console.log("开始时间戳：", startOfDay);
+  console.log("结束时间戳：", endOfDay);
+  
+  // 过滤聊天记录，只保留在指定日期范围内的记录
+  this.filteredChatHistories = this.chatHistories.filter(chat => {
+    const chatTimestamp = new Date(chat.createdAt).getTime(); // 聊天记录的时间戳
+    console.log("聊天记录时间戳：", chatTimestamp);
+    
+    return chatTimestamp >= startOfDay && chatTimestamp <= endOfDay; // 只保留在范围内的聊天记录
+  });
+}
+}

fashion-app/src/app/post-detail/post-detail.component.html

@@ -0,0 +1,165 @@
+<ion-content >
+  <!--帖子-->
+  <div class="post">
+    <div class="post-header">
+      <div class="avatar">
+        <img src= "{{post.get('user')?.image}}" alt="User Avatar" class="avatar-image">
+      </div>
+      <div class="user-info">
+        <span class="username"> {{post.get('user')?.username}}</span>
+        <!--关注按钮-->
+        <div [ngClass]="isFollowed ? 'fan-button' : 'follow-button'" (click)="toggleFollow()">
+          <div *ngIf="!isFollowed" class="distance">+</div>
+          <span *ngIf="!isFollowed" >关注</span>
+          <span *ngIf="isFollowed">已关注</span>
+        </div>
+      
+      </div>
+    </div>
+    <h2 class="post-title">{{post.get('title')}}</h2>
+<!--标签-->
+<div class="tag-container">
+  <div class="tag"  *ngFor="let tag of post?.data?.tag">
+    <ion-icon name="bookmark-outline" class="tagpicture">{{tag}}</ion-icon>
+</div>
+</div>
+
+    <p class="post-content-text" >{{post.get('content')}}</p> <!--内容-->
+    <div class="image-gallery" >
+      <img  src="{{image}}" alt="Post Image" class="post-image" *ngFor="let image of post?.data?.image">
+
+    </div>
+
+  </div>
+
+ <!-- 评论区域 -->
+ <div class="comment-section">
+  <h3 class="comment-title">全部评论(5)</h3>
+  
+  <div class="comment">
+    <div class="comment-box">
+      <div class="comment-left">
+        <div class="comment-avatar">
+          <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain" alt="User Avatar" class="comment-avatar-image">
+        </div>
+        <span class="floor">1L</span>
+      </div>
+      
+      <div class="comment-middle">
+
+        <div class="comment-content">
+          <span class="comment-username">用户昵称</span>
+          <p class="comment-text">这是用户的评论内容，描述了对帖子内容的看法。</p>
+          <span class="time-ago">5小时前</span>
+        </div>
+      </div>
+      
+      <div class="comment-right">
+        <ion-icon name="heart-outline" class="like-icon" ></ion-icon>
+        <span class="like-count">10</span>
+      </div>
+    </div>
+  </div>
+
+  <div class="comment">
+    <div class="comment-box">
+      <div class="comment-left">
+        <div class="comment-avatar">
+          <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain" alt="User Avatar" class="comment-avatar-image">
+        </div>
+        <span class="floor">1L</span>
+      </div>
+      
+      <div class="comment-middle">
+
+        <div class="comment-content">
+          <span class="comment-username">用户昵称</span>
+          <p class="comment-text">这是用户的评论内容，描述了对帖子内容的看法。</p>
+          <span class="time-ago">5小时前</span>
+        </div>
+      </div>
+      
+      <div class="comment-right">
+        <ion-icon name="heart-outline" class="like-icon" ></ion-icon>
+        <span class="like-count">10</span>
+      </div>
+    </div>
+  </div>
+
+  <div class="comment">
+    <div class="comment-box">
+      <div class="comment-left">
+        <div class="comment-avatar">
+          <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain" alt="User Avatar" class="comment-avatar-image">
+        </div>
+        <span class="floor">1L</span>
+      </div>
+      
+      <div class="comment-middle">
+
+        <div class="comment-content">
+          <span class="comment-username">用户昵称</span>
+          <p class="comment-text">这是用户的评论内容，描述了对帖子内容的看法。</p>
+          <span class="time-ago">5小时前</span>
+        </div>
+      </div>
+      
+      <div class="comment-right">
+        <ion-icon name="heart-outline" class="like-icon" ></ion-icon>
+        <span class="like-count">10</span>
+      </div>
+    </div>
+  </div>
+
+  <div class="comment">
+    <div class="comment-box">
+      <div class="comment-left">
+        <div class="comment-avatar">
+          <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain" alt="User Avatar" class="comment-avatar-image">
+        </div>
+        <span class="floor">1L</span>
+      </div>
+      
+      <div class="comment-middle">
+
+        <div class="comment-content">
+          <span class="comment-username">用户昵称</span>
+          <p class="comment-text">这是用户的评论内容，描述了对帖子内容的看法。</p>
+          <span class="time-ago">5小时前</span>
+        </div>
+      </div>
+      
+      <div class="comment-right">
+        <ion-icon name="heart-outline" class="like-icon" ></ion-icon>
+        <span class="like-count">10</span>
+      </div>
+    </div>
+  </div>
+
+  <div class="comment">
+    <div class="comment-box">
+      <div class="comment-left">
+        <div class="comment-avatar">
+          <img src="https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain" alt="User Avatar" class="comment-avatar-image">
+        </div>
+        <span class="floor">1L</span>
+      </div>
+      
+      <div class="comment-middle">
+
+        <div class="comment-content">
+          <span class="comment-username">用户昵称</span>
+          <p class="comment-text">这是用户的评论内容，描述了对帖子内容的看法。</p>
+          <span class="time-ago">5小时前</span>
+        </div>
+      </div>
+      
+      <div class="comment-right">
+        <ion-icon name="heart-outline" class="like-icon" ></ion-icon>
+        <span class="like-count">10</span>
+      </div>
+    </div>
+  </div>
+
+</div>
+</ion-content>

fashion-app/src/app/post-detail/post-detail.component.scss

@@ -0,0 +1,232 @@
+.post {
+    padding: 10px; /* 设置内边距 */
+    background-color: white; /* 背景色 */
+   
+    border-bottom: grey 1px solid; /* 下边框 */
+
+  }
+  
+  .post-header {
+    display: flex; /* 使用 Flexbox 布局 */
+    align-items: center; /* 垂直居中 */
+    margin-bottom: 10px; /* 标题与用户信息之间的间距 */
+  }
+  
+  .avatar {
+    width: 45px; /* 头像宽度 */
+    height: 45px; /* 头像高度 */
+    border-radius: 50%; /* 圆形头像 */
+    overflow: hidden; /* 隐藏超出部分 */
+    margin-right: 10px; /* 头像与用户名之间的间距 */
+    border: black 1px solid; /* 边框 */
+
+  }
+  
+  .avatar-image {
+    width: 100%; /* 头像宽度100% */
+    height: 100%; /* 头像高度100% */
+    object-fit: cover; /* 保持比例填充 */
+  }
+  
+  .user-info {
+    flex: 1; /* 让用户名部分占用剩余空间 */
+    display: flex;
+    justify-content: space-between; /* 用户名和三个点之间的间距 */
+    align-items: center; /* 垂直居中 */
+  }
+  
+  .username {
+    font-weight: bold; /* 加粗用户名 */
+    font-size: 22px; /* 用户名字体大小 */
+  }
+  
+  .more-icon {
+    font-size: 25px; /* 三个点图标大小 */
+    color: gray;
+    margin-right: 10px;
+  }
+  
+  .post-title {
+    font-size: 18px; /* 标题字体大小 */
+    margin: 10px 5px; /* 标题上下间距 */
+    font-weight: bold;
+  }
+  
+  //标签
+.tag-container {
+    display: flex;
+    justify-content: flex-start; /* 标签靠左对齐 */
+    margin-bottom: 10px; /* 将标签容器推到底部 */
+  }
+  
+  .tag {
+    background-color: #f0f0f0; // 灰色背景
+    color: black; // 黑色字体
+    border-radius: 20px; // 椭圆形效果
+    padding: 5px 10px; // 标签内边距
+    margin-right: 17px; // 标签之间的间距
+    font-size: 14px; // 标签字体大小
+    display: inline-flex; // 让标签内容居中
+    align-items: center; // 垂直居中
+  }
+  
+  .tagpicture{
+    margin-left: 5px;
+    margin-right: 5px;
+  }
+  
+  .post-content-text {
+    font-size: 18px; /* 帖子内容字体大小 */
+    margin-bottom: 10px; /* 内容与图片之间的间距 */
+  }
+  
+  .image-gallery {
+    display: flex; /* 使用 Flexbox 布局 */
+    
+    flex-wrap: wrap; /* 允许换行 */
+  }
+  
+  .post-image {
+    width: 32%; /* 每张图片占用32%的宽度 */
+    height: auto; /* 高度自适应 */
+    border-radius: 5px; /* 图片圆角 */
+    margin-bottom: 5px; /* 图片与下一张图片之间的间距 */
+    margin-right: 5px; /* 图片与下一张图片之间的间距 */
+
+  }
+
+  .button-container {
+    display: flex; /* 使用 Flexbox 布局 */
+    justify-content: space-between; /* 按钮之间的间距 */
+  }
+  
+  .action-button {
+    flex: 1; /* 每个按钮占用相同的空间 */
+    font-size: 17px; /* 按钮字体大小 */
+    align-items: center; // 垂直居中
+    color: black; // 字体颜色
+  }
+  
+  .action-button ion-icon {
+    font-size: 20px; /* 图标大小 */
+    margin-right: 5px; /* 图标与文本之间的间距 */
+  }
+//关注按钮
+  .follow-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 80px; /* 按钮宽度 */
+    height: 30px; /* 按钮高度 */
+    border-radius: 20px; /* 椭圆形 */
+    background-color: black; /* 初始背景色 */
+    color: white; /* 初始字体颜色 */
+    cursor: pointer;
+    transition: background-color 0.3s, color 0.3s; /* 添加过渡效果 */
+  }
+
+  //已关注按钮
+  .fan-button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 80px; /* 按钮宽度 */
+    height: 30px; /* 按钮高度 */
+    border-radius: 20px; /* 椭圆形 */
+    background-color:white; /* 初始背景色 */
+    color: black; /* 初始字体颜色 */
+  }
+
+  //+与关注的距离
+  .distance{
+    margin-right: 5px;
+  }
+
+
+  .comment-section {
+    background-color: white; /* 背景色 */
+    border-radius: 8px; /* 圆角效果 */
+  }
+  
+  .comment-title {
+    font-size: 20px; /* 标题字体大小 */
+    font-weight: bold; /* 加粗 */
+    margin-bottom: 15px; /* 标题与评论之间的间距 */
+    margin-left: 10px;
+  }
+  
+  .comment {
+    margin-bottom: 20px; /* 每条评论之间的间距 */
+  }
+  
+  .comment-box {
+    display: flex; /* 使用 Flexbox 布局 */
+
+  }
+  
+  .comment-left {
+    display: flex;
+    flex-direction: column; /* 垂直排列 */
+    align-items: center; /* 水平居中 */
+    margin-right: 10px; /* 左侧与中间盒子之间的间距 */
+    margin-left: 10px;
+  }
+  
+  .comment-middle {
+    flex: 1; /* 占用剩余空间 */
+    display: flex;
+    flex-direction: column; /* 垂直排列 */
+  }
+  
+  .comment-right {
+    display: flex;
+    margin-left: 10px; /* 右侧与中间盒子之间的间距 */
+    padding-right: 15px;
+  }
+  
+  .comment-avatar {
+    width: 45px; /* 头像宽度 */
+    height: 45px; /* 头像高度 */
+    border-radius: 50%; /* 圆形头像 */
+    overflow: hidden; /* 隐藏超出部分 */
+    margin-bottom: 5px; 
+  }
+  
+  .comment-avatar-image {
+    width: 100%; /* 头像宽度100% */
+    height: 100%; /* 头像高度100% */
+    object-fit: cover; /* 保持比例填充 */
+  }
+  
+  .floor {
+    font-size: 18px; /* 楼数字体大小 */
+    color: gray; /* 楼数颜色 */
+  }
+  
+  .comment-username {
+    font-weight: bold; /* 加粗用户名 */
+    font-size: 17px; /* 用户名字体大小 */
+  }
+  
+  .comment-text {
+    font-size: 16px; /* 评论内容字体大小 */
+    margin: 3px 0; /* 内容上下间距 */
+  }
+  
+  .time-ago {
+    font-size: 16px; /* 时间字体大小 */
+    color: gray; /* 时间颜色 */
+  }
+  
+  .like-icon {
+    font-size: 25px; /* 点赞图标大小 */
+    color: gray; /* 点赞图标颜色 */
+    margin-right: 5px; /* 图标与点赞数之间的间距 */
+  }
+  
+  .like-count {
+    font-size: 14px; /* 点赞数字体大小 */
+    color: black; /* 点赞数颜色 */
+    margin-top: 3px; /* 点赞数与评论之间的间距 */
+  }
+

fashion-app/src/app/post-detail/post-detail.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+
+import { PostDetailComponent } from './post-detail.component';
+
+describe('PostDetailComponent', () => {
+  let component: PostDetailComponent;
+  let fixture: ComponentFixture<PostDetailComponent>;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [PostDetailComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(PostDetailComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

fashion-app/src/app/post-detail/post-detail.component.ts

@@ -0,0 +1,36 @@
+import { CommonModule } from '@angular/common';
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { IonButton, IonContent, IonIcon } from '@ionic/angular/standalone';
+import { addIcons } from 'ionicons';
+import { bookmarkOutline, ellipsisHorizontal, heartOutline } from 'ionicons/icons';
+
+addIcons({ellipsisHorizontal,bookmarkOutline,heartOutline,})
+
+@Component({
+  selector: 'app-post-detail',
+  templateUrl: './post-detail.component.html',
+  styleUrls: ['./post-detail.component.scss'],
+  standalone: true,
+   imports: [IonContent, IonIcon, IonButton, CommonModule]
+})
+export class PostDetailComponent  implements OnInit {
+post: any;//点击的帖子的内容
+  constructor(private router: Router,) { 
+    const navigation = this.router.getCurrentNavigation();
+    if (navigation && navigation.extras.state) {
+       // 使用类型断言获取路由参数
+       this.post = (navigation.extras.state as { post: any }).post;
+       console.log(this.post);
+    }
+  }
+
+  ngOnInit() {}
+
+  isFollowed: boolean = false; // 初始状态为未关注
+
+  toggleFollow() {
+    this.isFollowed = !this.isFollowed; // 切换关注状态
+  }
+
+}

fashion-app/src/app/post/post.component.html

@@ -1,6 +1,6 @@
 <ion-content >
-  <div class="post" *ngFor="let post of posts">
-    <div class="post-header">
+  <div class="post" *ngFor="let post of posts" >
+    <div class="post-header" >
       <div class="avatar">
         <img [src]="post.get('user')?.image || 'https://tse1-mm.cn.bing.net/th/id/OIP-C.X-VG5gTN2ak8rGRij3oCogAAAA?rs=1&pid=ImgDetMain'" alt="User Avatar" class="avatar-image">
       </div>
@@ -9,6 +9,8 @@
         <ion-icon name="ellipsis-horizontal" class="more-icon"></ion-icon>
       </div>
     </div>
+
+    <div (click)="goToPostDetail(post)"><!--点击内容跳转到详情页面-->
     <h2 class="post-title">{{ post?.get('title') }}</h2>
 <!--标签-->
 <div class="tag-container">
@@ -21,6 +23,7 @@
     <div class="image-gallery">
       <img *ngFor="let image of post.get('image')" [src]="image" alt="Post Image" class="post-image">
     </div>
+  </div>
 
      <!-- 按钮区域 -->
      <div class="button-container">

fashion-app/src/app/post/post.component.ts

@@ -1,9 +1,10 @@
 import { CommonModule } from '@angular/common';
 import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
 import { IonButton, IonContent, IonIcon } from '@ionic/angular/standalone';
 import { addIcons } from 'ionicons';
 import { bookmarkOutline, chatbubbleOutline, ellipsisHorizontal, heart, heartOutline, shareSocialOutline, } from 'ionicons/icons';
-import { CloudObject, CloudQuery, CloudUser } from 'src/lib/ncloud';
+import { CloudObject, CloudQuery,} from 'src/lib/ncloud';
 
 addIcons({ ellipsisHorizontal, bookmarkOutline, shareSocialOutline, chatbubbleOutline, heartOutline, heart })
 
@@ -18,7 +19,7 @@ addIcons({ ellipsisHorizontal, bookmarkOutline, shareSocialOutline, chatbubbleOu
 export class PostComponent implements OnInit {
   posts: CloudObject[] = []; // 存储帖子
   resultUser: any;
-  constructor() { }
+  constructor(private router: Router) { }
 
   async ngOnInit() {
     const query = new CloudQuery('post'); // 创建查询对象
@@ -36,9 +37,13 @@ export class PostComponent implements OnInit {
   // 切换点赞状态
   toggleLike() {
     this.isLiked = !this.isLiked; // 切换状态
-  }
 
+    
+  }
 
+  goToPostDetail(post:any) {
+    this.router.navigate(['postdetail'], { state: { post: post } });
+  }
 
 
 

fashion-app/src/lib/ncloud.ts

@@ -323,7 +323,7 @@ export class CloudUser extends CloudObject {
     }
     clearUserCache(){
         // 清除用户信息
-        localStorage.removeItem("NCloud/dev/User")
+        localStorage.removeItem("NCloud/ylj/User")
         this.id = null;
         this.sessionToken = null;
         this.data = {};