Question

我正在使用Ionic3开发应用程序我想创建一个单选按钮列表。但是，我需要单选按钮显示在左侧，标签（文本）位于右侧任何想法？

<ion-item>
  <ion-radio value="friends" checked></ion-radio>
  <ion-label>Public</ion-label>
</ion-item>

<ion-item>
  <ion-radio value="family"></ion-radio>
  <ion-label>Private</ion-label>
</ion-item>

Answer 1

在Ionic 5中，使用slot="start"

<ion-item>
  <ion-radio slot="start"></ion-radio>
  <ion-label>Label</ion-label>
</ion-item>

如果要使单选按钮正确显示，请使用slot="end"。

Answer 2

您可以在ion-radio

中使用item-left属性

<ion-item>
    <ion-radio item-left></ion-radio>
    <ion-label>Option</ion-label>
</ion-item>

如何在ionic3中对齐单选按钮和标签

2 个答案: