@syntaxsugar

Как синхронизировать список опций между несколькими селектами во Vue?

Есть несколько селектов с одинаковым списком значений и есть задача заполнить массив на основе выбранных в каждом из селектов значений и его порядкового номера. То есть значение из первого селекта пишется в первый элемент массива и т.д. При этом значения в целевом массиве должны быть уникальны, а для этого после установки каждого значения нужно фильтровать список доступных элементов во всех селектах. Не пойму как реализовать. Если просто переносить элементы между массивами значений селектов и целевым то нарушается порядок индексов. Если использовать computed свойство для фильтрации отображаемых элементов в списке - то оно не обновляется самостоятельно. Еще не понятно по какому событию можно вернуть выбранные ранее элементы обратно если выбор в селекте поменялся (делался неоднократно).

  • Вопрос задан
  • 112 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега Vue.js
Делаете метод фильтрации опций, который в качестве аргумента принимает индекс текущего селекта:

filterItems(index) {
  return this.items.filter(n => [ -1, index ].includes(this.selected.indexOf(n)));
}

И передаёте в v-for отфильтрованные опции. Типа так.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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