lavezzi1
@lavezzi1

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

Есть несколько селектов, у каждого может выбираться value, нужно сделать так чтобы, например когда выбрал value в одном селекте, а потом выбираешь в другом, первый чистился. Как тут codepan.net/gist/1194c199270165e8d2753586a4d5a718

Вот мой черновик: jsfiddle.net/vxLhbo5m/173
По какой то причине на фидле была выбрана v1 vue
Вот обновленный черновик https://codesandbox.io/s/0p7w81yz5p
  • Вопрос задан
  • 291 просмотр
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Добавляете selected каждому элементу items, используете его в v-model, также отслеживаете переключение списка в родителе и сбрасываете selected всех элементов, кроме переключенного. Как-то так.

UPD. В комментариях было высказано мнение, будто бы предлагаемое решение является хаком, потому что...

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

1) За пределами компонента - а как иначе-то? Ведь изменение одного экземпляра компонента должно затронуть другие.

2) Добавление selected - не проблема. Делайте map массива items, закидывая в каждый элемент этот selected. Типа так. Или можете устанавливать значения selected с помощью $set в методе onCardChanged, типа так (а вот это уже действительно хак).

3) "Событиями реализовывать" - но ведь так и сделано. У вас была реализована генерация события input, обработку которого я и добавил.

UPD. Хотя можно оставить selected свойством компонента (дефолтное значение только объектом сделать), пусть хранит id элемента items и выбранный пункт выпадающего списка:

<vue-select
  :value="selected.id === item.id ? selected.option : null"
  :options="item.versions"
  @input="selected = { id: item.id, option: $event }"
></vue-select>
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
iRedds
@iRedds
Модель работает только для элементов формы.
Об этом кстати пишется в консоли, когда используешь dev версию.
Поэтому биндишь на компонент событие, чтобы можно были изменять свойство и так же биндишь свойство.
В самом компоненте по событию выбора тригеришь событие инстанса.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы