Я пытаюсь реализовать поле выбора при использовании Vue.
В моем шаблоне у меня есть следующий фрагмент кода:
<div class="btn-group btn-group-justified">
<v-select v-model="search">
<v-option v-for="option in Options" :value="option">{{ option }}</v-option>
</v-select>
</div>
импорт:
import { select, option } from 'vue-strap/dist/vue-strap';
Это общий компонент, который используется на разных страницах в Интернете (переход на другой путь не требует обновления страницы).
Если я перейду между этими страницами, он сохранит старые настройки. Чтобы понять проблему, рассмотрите следующий пример:
Страница A имеет следующий список параметров: [dog,cat]
Страница B имеет следующий список параметров: [bird,dog]
Если я открою страницу A, она покажет: [dog,cat].
Если я перейду на страницу B, она покажет [dog,dog,cat,bird].
Если я снова перейду на страницу A, она покажет [dog,dog,cat,bird,dog,cat].
Я пытался инициализировать options в watch каждый раз, когда $route меняется, но это не помогло.
Есть предложения по решению этой проблемы?