小编JMo*_*abs的帖子

为什么 Ionic 4 Ion-Slides 突然停止正常显示?

我有一个已经实现了离子幻灯片的 Ionic 4 项目。一切都很好,直到最近对 Ionic 进行了更新(不到一个月前),然后它们突然停止了工作。

在第一次加载时,它们似乎很好,但在之后的任何加载中:

  • 寻呼机不工作或出现
  • 图像大小不正确
  • 滚动工作但不会像它应该的那样将幻灯片对齐到中心

第一次加载工作: 预期的离子载玻片图像

第二次加载没有: 离子载玻片损坏的图像

没有错误消息或警告,以下所有代码在 1 个月前都运行良好,此后没有进行任何更改。它只是随机破裂。

HTML:

<ion-slides #slides pager="true">
  <ion-slide *ngFor="let option of options; let i = index">
    <ion-card mode="md" [ngStyle]="{'background': borderColors[i]}">
      <img style="object-fit: contain; border-radius: 20px; padding: 2px;" [src]="option.imageUrl">
    </ion-card>
  </ion-slide>
</ion-slides>
Run Code Online (Sandbox Code Playgroud)

TS:

import { Component, Input, ViewChild } from "@angular/core";
import { IonSlides } from "@ionic/angular";
import { ContestOption } from "src/app/models/contest-model";

@Component({
  selector: "app-results-swiper",
  templateUrl: "./results-swiper.component.html",
  styleUrls: ["./results-swiper.component.scss"]
})
export class ResultsSwiperComponent {
  @Input() options …
Run Code Online (Sandbox Code Playgroud)

ionic-framework ion-slides angular ionic4

6
推荐指数
1
解决办法
2339
查看次数

标签 统计

angular ×1

ion-slides ×1

ionic-framework ×1

ionic4 ×1