Vue中的路由是什么?如何配置路由?

在Vue中,路由用于构建单页面应用。它允许我们根据不同的URL路径加载不同的组件,从而实现页面内部的切换和导航。要配置路由,我们需要引入vue-router库,并根据页面需求定义一组路由规则。代码讲解

<div id="app">  <router-link to="/home">主页</router-link>  <router-link to="/about">关于</router-link>  <router-view></router-view></div><script>const Home = { template: '<div>这是主页</div>' }const About = { template: '<div>这是关于页面</div>' }const routes = [  { path: '/home', component: Home },  { path: '/about', component: About }]const router = new VueRouter({  routes})new Vue({  el: '#app',  router})</script>

在上述示例中,我们通过标签创建了两个导航链接,指向主页和关于页面。使用标签来显示当前激活的组件。

发表评论