在 Ionic 6 中使用 Ionic 5 日期选择器

Question

您好，我在我的项目中使用 ionic 5，最近迁移到 ionic 6，一切看起来都很棒，但我担心的一件事是日期时间选择器，我希望以这种方式使用旧样式，请帮忙！

Answer 1

您可以使用一些黑客技术来做到这一点。接受ion-datetime名为 的属性yearValues，您可以在其中创建“自定义”年份值。

html:

  <div class="hacking-datetime">
    <ion-datetime presentation="year" [yearValues]="yearValues"></ion-datetime>
    <ion-datetime presentation="month-year"></ion-datetime>
  </div>

ts:

yearValues = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30];

css:

.hacking-datetime {
  display: grid;
  grid-template-columns: 1fr 2fr;
  position: absolute;
  bottom: 0;
  width: 100%;
}

演示图片在这里

尽管它在视觉上与以前相同（当然在一些CSS之后），但在编程上你必须做很多工作。而且，正如我之前所说，这是一个 hack，所以我真的不建议您使用它:-)