Vue, vuetify, компонент list-item-group: как привязать активный list-item?

Question

[EranosyanEduard]

Здравствуйте.

Я пытаюсь создать компонент sidebar, используя vue/vuetify. Компонент содержит список, который в свою очередь содержит компонент v-list-item-group, позволяющий контролировать какой элемент списка выбран при помощи директивы v-model. В случае, если я использую пример из документации, то все работает корректно, но если я добавлю компоненту v-list-item (дочерний по отношению к v-list-item-group) пропс to, то указанный контроль работает неккоректно. Почему и возможно ли это исправить?

Оригинальный codepen и мой

Answer 1

[0xD34F]

При указании to элемент списка начинает работать как ссылка - внутри v-list-item будет создаваться router-link, который в вашем случае создать невозможно, по причине отсутствия роутера. Ну и всё, дальше выяснять, что конкретно и почему не работает - не интересно.

Определитесь, как вы хотите управлять активностью элементов списка. Если действительно с помощью роутера - ну так добавьте его, определите маршруты, уберите v-model. Если через v-model - не надо пытаться указывать to.