#javascript #vue.js #vue-router
Вопрос:
Предположим, я создал маршрут следующим образом: router.js:
import Vue from "vue";
import Router from " vue-router";
import BookRoutes from "./routes/book";
Vue.use(Router)
const router = new Router({
routes:[
{
path: "/book",
name: "book",
component:{
render(c) {
return c("router-view")
}
},
childern: BookRoutes
}
]
})
Маршруты-> забронировать ->> index.js
const BookProfile = () =>
import (/* webpackChunkNames: "BookProfile" */ "@/components/profile/book/BookProfile")
import BookRoutes from "./Book";
export default [{path:
"book/:bookId",
"name": "profile.book",
redirect: {name: "profile.book.fee"},
component: BookProfile,
children: BookRoutes
}]
Book.Js:
const BookFee = () => import (/* webpackChunkName: "BookProfilr" */)
export default:[{
path: "book-fee",
name: "profile.book.fee",
component: BookFee
}]
Таким же образом создается почти список маршрутов, как получить список всех маршрутов, если возможно, с заполненным идентификатором, если не список всех маршрутов, созданных в проекте vue.
Если кому-нибудь понадобится дополнительная информация, пожалуйста, дайте мне знать.
Ответ №1:
Вы можете использовать getRoutes
метод экземпляра маршрутизатора в любом дочернем компоненте, например :
mounted(){
let routes = this.$router.getRoutes()
}
Комментарии:
1. Извини, что я не понял. Я очень новичок в vue js и совершенно не могу понять. Не могли бы вы привести пример или любую статью, на которую я могу сослаться. Я не понимаю, где я могу использовать метод getRoutes и как его использовать.
2. PS: Я хочу получить список всех маршрутов сразу в списке, если это возможно.
3. Попробуйте это.$маршрутизатор.параметры.маршруты
Ответ №2:
<template>
<ul>
<li v-for="(item, key) in items" :key="key">
<router-link :to="item.name">{{item.name}}</router-link>
</li>
</ul>
</template>
<script>
export default {
data() {
return {
items: []
}
},
created() {
this.$router.options.routes.forEach(route => {
this.items.push({
name: route.name,
path: route.path
})
})
}
}
</script>
Комментарии:
1. Дает ли это URL-адрес для всех вложенных или обычных маршрутов? Не могли бы вы, пожалуйста, предложить мне лучший способ создания карты сайта для всех URL-адресов, поскольку на эту тему очень мало статей.
2. Лучший способ решить вашу проблему-использовать библиотеку npmjs.com/package/vue-cli-plugin-sitemap
3. 🔀 поддержка динамических маршрутов с одним или несколькими параметрами 🍱 поддержка вложенных маршрутов