Vaadin-combo-box: Повторяющийся элемент при поиске

Созданный на 27 мар. 2017  ·  14Комментарии  ·  Источник: vaadin/vaadin-combo-box

Описание

Повторяющийся элемент при поиске

Ожидаемый результат

Должен отображаться только один элемент

capture d ecran 2017-03-27 a 00 58 46

Фактический результат

capture d ecran 2017-03-27 a 00 43 54

Действия по воспроизведению

  1. Поместите на страницу элемент vaadin-combo-box
        <vaadin-combo-box #searchSport no-label-float
        *ngIf="activitiesTypes"
          placeholder="Activité"
          [items]="activitiesTypes"
          item-label-path="name"
          item-value-path="$key"
          [value]="activitiesTypeUid"
          (selected-item-changed)="activitiesType=$event.detail.value">
        </vaadin-combo-box>

с участием

    this.activitiesTypes = [
      {
        $key : 'tennis',
        name: 'tennis'
      },
      {
        $key : 'canoe',
        name: 'canoe'
      }
    ];
  1. Откройте страницу в веб-браузере.
  2. Щелкните элемент vaadin-combo-box и выполните поиск элемента.

Затронутые браузеры

  • [x] Chrome
  • [ ] Fire Fox
  • [] Safari
  • [ ] Край
  • [] IE 11
  • [] iOS Safari
  • [x] Android Chrome

Вроде бы только в Chrome и android Chrome. Я тестировал firefox, safari, и он работает.

Он работал с выпуском v1.2.0, а ошибка началась в v1.3.0

Самый полезный комментарий

Спасибо за помощь, вот фрагмент, чтобы воспроизвести проблему:
https://jsfiddle.net/Saulis/we90kg2t/

Все 14 Комментарий

Привет!

Я не могу воспроизвести проблему в чистом приложении Polymer, поэтому предполагаю, что это как-то связано с Angular. См. Https://jsfiddle.net/Saulis/6kooy6d8/

У вас есть ошибки в консоли?

Ваш jsfiddle работает в моем браузере.

Итак, вы правы, это из-за angular. У вас есть шаблон с угловым и полимерным для jsfiddle, чтобы воспроизвести эту ошибку?

Ошибок в консоли нет.

Я создал плункер с угловым и полимерным, но ошибки нет: https://plnkr.co/edit/pGqa0MXftgpMCSaAXCIO?p=preview

Я продолжу исследование, чтобы найти причину ошибки.

Я тоже испытываю это при использовании Polymer 1.8.1 и Chrome. В других браузерах проблем не возникает. Я начинаю верить, что в Chrome есть состояние гонки для больших приложений, которое вызывает это. Чтобы еще раз подтвердить, отлично работает с vaadin-combo-box 1.2.0 и не работает правильно в 1.3.3

@flyweight можете ли вы создать jsfiddle, где возникает проблема?

Я также пытаюсь выяснить, где это могло происходить, но получаю те же результаты, что и @ florent1933.

Просто обратите внимание на @Saulis : если я использую ваш шаблон для показанного здесь элемента, то я не вижу проблемы. Он появляется только в том случае, если я не добавляю настраиваемый шаблон.

У меня та же проблема, что и у @ florent1933, и я думаю, что знаю, в чем проблема. Я использую шаблон Polymer CLI, который создает некоторые параметры конфигурации Polymer в файле index.html. По умолчанию это выглядит так:

window.Polymer = {
  dom: 'shadow',
  lazyRegister: true,
};

По умолчанию для свойства DOM установлено значение «shadow», но если вы измените его на «shady», проблема будет решена. Элемент не дублирует элементы при поиске. Есть ли способ заставить его работать, используя «тень», или элемент должен работать только с «тени»?

Подтверждая то, что @ Andres0101 заявил выше, изменение этого свойства также решает проблему для меня.

@ Andres0101 : хорошая работа для поиска проблемы этого вопроса 👍

Было бы здорово, если бы поле со списком могло работать с теневым домом, потому что я не могу использовать теневой дом.

Спасибо за помощь, вот фрагмент, чтобы воспроизвести проблему:
https://jsfiddle.net/Saulis/we90kg2t/

Не знаю, видели ли вы, но когда мы ищем, невозможно выбрать повторяющийся элемент с помощью стрелки вниз на клавиатуре. Захотелось уточнить этот момент.

@ LM450N : Вы правы! Прекрасные новости!

Спасибо @ LM450N за обнаружение 4f02971!

Я собираюсь отметить эту проблему закрытой в v2.0.0-alpha1 и рекомендую перейти к ее использованию.

Для тех, кто использует 1.3.x , я выбрал исправление для ветки 1.x - но будьте осторожны, в этой ветке есть некоторые критические изменения, касающиеся использования пользовательских значков - они используют slot атрибуты вместо классов.

Была ли эта страница полезной?
0 / 5 - 0 рейтинги