tab3

src/app/tab3/tab3.page.html

@@ -1,17 +1,22 @@
-<ion-header [translucent]="true">
+<ion-header>
   <ion-toolbar>
-    <ion-title>
-      Tab 3
-    </ion-title>
+    <ion-title>动态</ion-title>
   </ion-toolbar>
 </ion-header>
 
-<ion-content [fullscreen]="true">
-  <ion-header collapse="condense">
-    <ion-toolbar>
-      <ion-title size="large">Tab 3</ion-title>
-    </ion-toolbar>
-  </ion-header>
-
-  <app-explore-container name="Tab 3 page"></app-explore-container>
-</ion-content>
+<ion-content>
+  <ion-list>
+    <ion-item class="news" (click)="goToNews()">
+      <ion-label>新闻</ion-label>
+    </ion-item>
+    <ion-item class="interest" (click)="goToInterest()">
+      <ion-label>兴趣</ion-label>
+    </ion-item>
+    <ion-item class="friend-dynamic" (click)="goToFriendDynamic()">
+      <ion-label>朋友动态</ion-label>
+    </ion-item>
+    <ion-item class="shake" (click)="goToShake()">
+      <ion-label>摇一摇</ion-label>
+    </ion-item>
+  </ion-list>
+</ion-content>

src/app/tab3/tab3.page.scss

@@ -0,0 +1,28 @@
+ion-item {
+    cursor: pointer;
+    transition: transform 0.3s;
+  
+    ion-label {
+      font-size: 24px;
+    }
+  }
+  
+  .news {
+    background-color: #FFD700; /* 金色 */
+  }
+  
+  .interest {
+    background-color: #FF69B4; /* 粉色 */
+  }
+  
+  .friend-dynamic {
+    background-color: #87CEEB; /* 天蓝色 */
+  }
+  
+  .shake {
+    background-color: #32CD32; /* 青绿色 */
+  }
+  
+  ion-item:hover {
+    transform: scale(1.1);
+  }

src/app/tab3/tab3.page.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import { Router } from '@angular/router';
 
 @Component({
   selector: 'app-tab3',
@@ -6,7 +7,21 @@ import { Component } from '@angular/core';
   styleUrls: ['tab3.page.scss']
 })
 export class Tab3Page {
+  constructor(private router: Router) {}
 
-  constructor() {}
+  goToNews() {
+    this.router.navigate(['/news']);
+  }
 
-}
+  goToInterest() {
+    this.router.navigate(['/interest']);
+  }
+
+  goToFriendDynamic() {
+    this.router.navigate(['/friend-dynamic']);
+  }
+
+  goToShake() {
+    this.router.navigate(['/shake']);
+  }
+}