如何在离子列表中逐一对齐离子输入

Question

我是离子框架的新手 - (使用离子框架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中，如离子文档中所述：

<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>