如何在離子列表中一一對齊離子輸入

Question

我是Ionic框架的新手-（使用Ionic框架3）

<ion-row>
      <ion-col>
        <ion-list inset>
            <ion-item>
                <ion-input name="products" id="" type="text" required></ion-input><br>
                <ion-input name="products" id="" type="text" required></ion-input><br>
            </ion-item>
        </ion-list>
      </ion-col>
</ion-row>

上面的html離子代碼並排生成輸入字段。 但是我要一個接一個地輸入字段

請參閱有關我的問題的附件。

請以正確的方式指導我。 謝謝。 發行圖片

Answer 1

只需將每個輸入字段放在一個ion-item ，如Ionic docs中所述 ：

<ion-row>
  <ion-col>
    <ion-list inset>
      <ion-item>
        <ion-input name="products" id="" type="text" required></ion-input>
      </ion-item>
      <ion-item>
        <ion-input name="products" id="" type="text" required></ion-input>
      </ion-item>
    </ion-list>
  </ion-col>
</ion-row>