Ionic 4: ion-select плохо работает на IOS

#ionic-framework #hybrid-mobile-app #ionic4

#ionic-framework #гибридное мобильное приложение #ionic4

Вопрос:

В IOS ion-select не запускает выбор при нажатии на него. Это происходит при нажатии на его границы.

Пример ошибочного кода :

     <ion-list>
    <ion-item no-padding>
      <ion-label position="floating">{{'GENDER' | translate}}</ion-label>
      <ion-select formControlName="gender">
        <ion-select-option value="male">{{"MALE" | translate}}</ion-select-option>
        <ion-select-option value="female">{{"FEMALE" | translate}}</ion-select-option>
      </ion-select>
    </ion-item>
    </ion-list>
  

Я что-то упускаю?

Ответ №1:

Неисправная часть — это position="floating" на label элементе. Удаление его или добавление чего-то другого, подобного stacked , устраняет проблему.

 <ion-list>
  <ion-item no-padding>
    <ion-label>{{'GENDER'}}</ion-label>
    <ion-select formControlName="gender">
      <ion-select-option value="male">{{"MALE" }}</ion-select-option>
      <ion-select-option value="female">{{"FEMALE"}}</ion-select-option>
    </ion-select>
  </ion-item>
</ion-list>
  

Ответ №2:

Добавьте tappable атрибут в <ion-item> :

 <ion-list>
 <ion-item tappable no-padding>
    <ion-label position="floating">{{'GENDER' | translate}}</ion-label>
    <ion-select formControlName="gender">
    <ion-select-option value="male">{{"MALE" | translate}}</ion-select-option>
    <ion-select-option value="female">{{"FEMALE" | translate}}</ion-select-option>
    </ion-select>
 </ion-item>
</ion-list>
  

Комментарии:

1. Нет, к сожалению, это не помогает

2. @JeremyBelolo пожалуйста, проверьте эту ссылку github.com/ionic-team/ionic/issues/5838#issuecomment-196592935 , как и предлагалось, попробуйте обернуть его div и добавить tappable . Пожалуйста, также сообщите мне.

3. Хорошо, нет, это совсем не то, спасибо 🙂 Это касается задержки, когда я сообщаю, что компонент сломан — не работает при нажатии на него, только на его краю