s202226701008/scene-app/src/app/tab1/tab1.page.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-avatar src="assets/logo.png" alt="灵思剧境"></ion-avatar>
    </ion-buttons>

  </ion-toolbar>
</ion-header>

<ion-content>


<h1>推荐剧本</h1>
  <!-- 推荐剧本区域 -->
  <ion-list>
    <ion-item-sliding *ngFor="let script of scripts">
      <ion-item>
        <ion-thumbnail slot="start">
          <img [src]="script.coverImage" alt="{{ script.title }}">
        </ion-thumbnail>
        <ion-label>
          <h2>{{ script.title }}</h2>
          <p>{{ script.description }}</p>
        </ion-label>
      </ion-item>
      <ion-item-options side="end">
        <ion-item-option (click)="startExperience(script)">立即体验</ion-item-option>
      </ion-item-options>
    </ion-item-sliding>
  </ion-list>
<h1>用户分享</h1>
  <!-- 用户评价区域 -->
  <ion-list>
    <ion-item *ngFor="let review of reviews">
      <ion-avatar slot="start">
        <img [src]="review.avatar" alt="{{ review.username }}">
      </ion-avatar>
      <ion-label>
        <h2>{{ review.username }}</h2>
        <p>{{ review.content }}</p>
        <p>{{review.rating}}</p>
      </ion-label>
    </ion-item>
  </ion-list>
  
  
</ion-content>