Vue权限管理开发实战4-封装vue-router

原创
2020/10/19 18:20
阅读数 765

路径多了之后,之前写的路径会比较繁琐,维护起来比较麻烦,所以需要对路径进行封装。

1.修改import的引入位置,方便封装

原来的写法:

修改后的写法

2. 提取方法

3.简化写法

url里的路径不区分大小写,大小写都可以访问到;文件名区分大小写,拼写不对找不到文件

4.如果定义了属性,使用定义的属性

再简化

5.router文件就写到这里了,写好之后要在main.js里引入,引入代码

import router from './router'
new Vue({
  el: '#app',
  router
})

6.在App.vue里引入router-view

<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
  export default {
    name: 'App'
  }
</script>

<style>
</style>

完整前后台代码托管在gitee上,地址 https://gitee.com/gintone/Guard

展开阅读全文
加载中
点击引领话题📣 发布并加入讨论🔥
0 评论
0 收藏
0
分享
返回顶部
顶部