В чём может быть причина того, что при открытии модального окна из дочернего компонента маршрут сбрасывается на корневой и как это исправить?
Например, у меня есть заказы, проваливаясь в заказ видим позиции товаров, которые в цикле сделаны. Маршрут примерно такой: "\заказ\номер_заказа". В компоненте товара есть модальное окно-увеличение картинки, нажимая на него, маршрут сбивается. Модальное окно используется из b-modal из bootstrap-vue.
Файл заказа:<template>
<item
v-for="item in orderElements"
:key="item.id"
:item="item"
:order-id="order.id"
:status="checkStatus"
/>
</template>
<script>
export default {
name: 'OrderItems',
components: {
Item
},
}
</script>
Код компонента позиции товара:<template>
<a
:id="item.id"
v-b-modal="'img-'+item.id"
href="#"
>
<img :src="item.element.image" height="80px">
</a>
<b-modal
:id="'img-'+item.id"
ref="modalChangeItem"
centered
:title="item.name"
hide-footer
>
<div class="mx-auto d-table">
<img :src="item.element.image">
</div>
</b-modal>
</template>
Файл с маршрутами:export default new Router({
routes: [
{
path: '/order-items/:orderId',
name: 'OrderItems',
component: OrderItems,
props: (route) => ({ orderId: Number(route.params.orderId), orderData: route.params.order }),
beforeEnter: ifAuthenticated,
},
],
Маршрут до открытия модального окна: