Vue路由遍历生成复数router-link，如何实现？

本文共计1513个文字，预计阅读时间需要7分钟。

业务场景：使用vue-cli搭建一个SPA；

需求：顶部导航栏控制下方内容栏，实现页面内内容切换。

无疑问，vue-router非常适合这样的需求，实现起来既简单又不复杂：

1. main.jsjavascriptimport Vue from 'vue';import VueRouter from 'vue-router';

Vue.use(VueRouter);

// 路由配置const routes=[ { path: '/', component: ()=> import('./components/Home.vue') }, { path: '/about', component: ()=> import('./components/About.vue') }];

const router=new VueRouter({ routes});

new Vue({ router}).$mount('#app');

业务场景：使用vue-cli做一个spa；

需求：顶部导航栏控制下方内容栏，实现页面内切换。