Question

我有一个离子项目，其中包含一个离子日期时间和一个离子图标。在这两个平台中，单击datetime容器时都会打开日期选择器。在iOS中，单击图标（日历图标）会打开日期选择器。但是在Android中，它什么也没做。

我尝试将图标的z索引更改为-X，但是它将从日期时间输入中删除该图标。

<ion-item >
      <ion-datetime displayFormat="MM/DD/YYYY"></ion-datetime>
      <ion-icon class="calendar-icon" name="calendar-outline" item-right></ion-icon>
</ion-item>

使用了CSS。

.calendar-icon {
    position: absolute;
    right: 5px;
    bottom: 4px;
  }

期望与iOS相同，如果单击日历图标，则在Android中将显示日期选择器。

Answer 1

在Ionic 4中，您可以执行类似附件代码段中的操作。无需其他CSS。您可以在Ionic official docs中找到有关ion-datetime使用情况的更多信息。

<script type="module" src="https://unpkg.com/@ionic/core@latest/dist/ionic/ionic.esm.js"></script>
<script nomodule="" src="https://unpkg.com/@ionic/core@latest/dist/ionic/ionic.js"></script>
<link href="https://unpkg.com/@ionic/core@latest/css/ionic.bundle.css" rel="stylesheet">
<script type="module" src="https://unpkg.com/ionicons@latest/dist/ionicons/ionicons.esm.js"></script>
<script nomodule="" src="https://unpkg.com/ionicons@latest/dist/ionicons/ionicons.js"></script>

<ion-card>
  <ion-item>
    <ion-datetime dateFormat="MM/DD/YYYY" placeholder="Select date"></ion-datetime>
    <ion-icon name="calendar" slot="end"></ion-icon>
  </ion-item>
</ion-card>

离子图标无法与Android中的离子日期时间一起使用

1 个答案: