使用vue-router实现简单的页面跳转

身为后端开发,和管理系统打交道是必不可少的,而我们的管理系统一般都是在一个页面展示多个菜单的内容,俗称单页面

举个例子:

使用vue-router实现简单的页面跳转_第1张图片

点击不同的菜单  右侧显示不同的内容,那么使用vue如何实现呢 

首先我们需要引入 vue-router  文档链接(https://router.vuejs.org/zh/api/)

先实现一个hello world 非常简单




    
    Title
    
    
    


首页 账户管理

注意 选中链接 默认是给了router-link-active,但是这个class并没有设置样式,我们可以自己修改,如果我们感觉这个class名字太长了 我们也可以通过linkActiveClass来修改class的名字。还有任务导航都应该有一个重定向的操作,比如输入错误的url我们要给他跳到首页上,这就使用了redirect来重定向。。。。

你可能感兴趣的:(vue)