Как перерисовать или отключить опции?

Question

[Max89]

Массив приходит с бека. Когда нажимаю кнопку "добавить еще категорию" добавляется еще селект, но там должна отсутствовать или быть отключена опция с выбором предыдущих селектов. Добавлял дополнительный ключь isActive:
true, но не происходит изменение в предыдущих селектах. Как можно перерисовать списки опций?

let list = [
                    {id:1, name: 'Категория 1'},
                     {id:2, name: 'Категория 2'},
                      {id:3, name: 'Категория 3'},
                       {id:4, name: 'Категория 4'}
                  ]

Answer 1

[0xD34F]

отключить

убрать

Comments

[Max89]

А под 2 версию есть что то похожее?

[0xD34F]

Max89, а самостоятельно переписать - нет, никак?

[Max89]

0xD34F, Я пока не понимаю как с reactive быть

[0xD34F]

Max89, каким образом данные становятся реактивными?

[Max89]

0xD34F, у меня Nuxt, попробовал через Vue.observable, но все равно не обновляется список.

[0xD34F]

Max89, сочувствую.

[Max89]

Не могу понять [ -1, i ] в :disabled="![ -1, i ].includes(selected.indexOf(val))", можете объяснить эту конструкцию?

[0xD34F]

Max89, в каких случаях не надо блокировать option? Если он нигде не выбран или выбран в текущем select'е. Так что смотрим индекс значения option'а в массиве выбранных значений и проверяем, что он равен -1 (т.е. отсутствует, т.е. не выбран) или индексу текущего select'а. Ну и инвертируем результат проверки.

То же самое, но иначе - значение текущего option'а присутствует среди выбранных и при этом не равно выбранному значению текущего select'а:

:disabled="selected.includes(val) && n !== val"

Или, ещё вариант, проверяем, есть ли среди выбранных значений такое, которое совпадает со значением текущего option'а, но при этом не совпадает со значением текущего select'а:

:disabled="selected.some(m => m === val && m !== n)"

[Max89]

0xD34F, Спасибо, а то сама запись показалась необычный и гугл не помог найти объяснение.