概念路由的本质就是一种对应关系，比如说我们在url地址中输入我们要访问的url地址之后，浏览器要去请求这个url地址对应的资源。 那么url地址和真实的资源之间就有一种对应的关系，就是路由。路由分为前端路由和后端路由 1).后端路由是由服务器端进行实现，并完成资源的分发 后端路由性能相对前端路由来说较低，所以，我们接下来主要学习的是前端路由 2).前端路由是依靠hash值(锚链接)的变化进行实现
转载
2024-03-24 14:43:07
113阅读
折腾了两天终于完成了基于security的认证，开始完成功能部分添加自己的定制路由：路由信息都存在这个位置： 分别对应着： 路径， 组件， 转发地址， 子属性：{地址，跳转页面路径，表现{标题，图标}} 在这里直接添加就可以了；异步路由： 属性内容如上，不同的是，只有用户具有【roles】内的角色时才会显示这个路由，【admin角色显示所有，不受权限控制】； 这里的校验直接按照role给了，不同于
转载
2024-05-14 22:50:44
160阅读
Vue中路由详解什么是路由？基本使用几个注意点多级路由（嵌套路由）路由的query参数命名路由路由的params参数跳转+传参 总结路由的props的配置路由懒加载```<router-link>```的replace属性编程式路由导航`$router`和`$route`的区别**1、route对象****2、router对象**缓存路由组件两个新的生命周期钩子路由守卫路由器的三种种
Vue路由实现、路由导航、路由模式
1.$router和$route区别 router为VueRouter的实例，相当于一个全局的路由器对象，里面含有很多属性和子对象，例如history对象，和router-link跳转一样,this.$router.push会往history栈中添加一个新的记录。 route相当于当前正在跳转的路由对象,可
文章目录六、 路由6-16-1-16-1-26-1-3 基本使用：6-1-4 几个注意点6-1-5 多级路由6-1-5-16-1-5-2 query参数6-1-5-3 命名路由6-1-5-4 路由的params参数6-1-5-5 路由的props配置6-1-5-6 .```<router-link>```的replace属性6-1-5-7 编程式路由导航6-1-5-8 缓存路由组件6
转载
2024-08-30 12:47:29
73阅读
在某些情况，需要添加的路由不确定，需要从后端获取数据，并且后端更新相关的路由时，页面也能够立即渲染出来，这时候就需要使用动态路由。 例如商城后台项目，菜单中的很多路由都是不确定的，即使你写了10个路由，但是后端那边新增了10个路由，那么这时候设置动态添加路由后，就可以自动在第一时间创建出所有的路由，而不需要你手动的写了。1、设置默认路由以及动态路由 ① 这里需要注意动态路由和默认路由都需要加上na
转载
2024-03-26 12:27:13
104阅读
1，安装element : vue add element2，安装路由 ： vue add router3，创建路由的过程 ： (1) 新建 vue页面 main.vue , （2
原创
2022-04-19 16:27:06
432阅读
本项目采用的模板为vue-element-admin i18n分支在网上看了很多教程，发现都写的很复杂(本人比较菜) , 用尽千辛万苦终于实现了这个功能首先修改src/store/modules目录下的permission.js文件为了区分，下面先附上原文件代码import { asyncRoutes, constantRoutes } from '@/router'
/**
* Use me
转载
2024-06-19 10:55:56
187阅读
在项目中出现的情况是路由变化后，url变化了，但是页面没有刷新，手动刷新一下才出现应有的画面。情况一：在 github 的 vue-router 中找到同样的一个问题：3.0.1版本通过router实例无法跳转昨天发现有些路由不能正常跳转，找了一下发现都是那些实例化后使用 router.push 而不是直接使用 this.$router.push 的地方。注意： 1.this.$router.go
能够构建出色的单页应用程序(SPA)是 Vue.js 最具有吸引力的功能之一。SPA 非常好，因为它们不需要在每次更改路由时都去加载页面。这就意味着一旦加载了全部内容，就可以真正快速地对视图进行切换，并提供出色的用户体验。如果你想要基于 Vue 去构建 SPA，则需要 Vue 路由。在本教程中，我将介绍设置 Vue Router 的基础知识，并研究一些更高级的技术，例如：动态路由匹配导航挂钩(Na
转载
2024-08-06 09:25:18
127阅读
首先说下遇到的问题1.进入嵌套路由，当前父导航无法高亮显示2.页面刷新后导航重置问题3.在嵌套路由刷新页面也会导致导航重置问题接下来是解决方案：elementUI 里面有个属性 default-active(当前激活菜单的
原创
2022-03-04 13:51:44
161阅读
首先说下遇到的问题1.进入嵌套路由，当前父导航无法高亮显示2.页面刷新后导航重置问题3.在嵌套路由刷新页面也会导致导航重置问题接下来是解决方案：elementUI 里面有个属性 default-active(当前激活菜单的 index)<el-menu :default-active="activeIndex" @select="handleSelect" rou...
原创
2021-09-09 14:19:18
214阅读
首先说下遇到的问题 1.进入嵌套路由，当前父导航无法高亮显示 2.页面刷新后导航重置问题 3.在嵌套路由刷新页面也会导致导航重置问题 接下来是解决方案： elementUI 里面有个属性 default active(当前激活菜单的 index) 这样就OK了 END 觉得有帮助的小伙伴点个赞支持下
原创
2021-10-22 15:06:00
546阅读
一.Vue渐进式 JavaScript 框架二.Vue安装1.安装node.js node.js中文网下载网址http://nodejs.cn/download/ 下载安装后，打开命令行（win+r 输入cmd）输入node -v 查看node的版本号，若显示如图则安装成功。安装完node.js也就有了npm管理器，它是集成在node中的，输入 npm -v 命令，显示npm的版本信息
转载
2024-02-26 11:03:29
149阅读
最近整理了一下关于vue后台管理项目动态路由权限管理及菜单的渲染：环境：vue3.0+element-plus+vue-router4.0思路：router/index.js文件：配置路由，路由分为两部分：公共路由+动态路由（注意：配置不存在路由跳转到默认页面的代码，需要写在动态路由里，否则会造成刷新页面，跳转到默认页面）router/permission.js文件全局导航守卫，设置路由拦截（在m
转载
2024-07-29 13:43:01
358阅读
公司最近项目是后台管理系统，由我负责，网上找模板发现还需要改很多地方，而且那些模板也没有写代码的实现思路，对于vue项目经验不足者很难看懂，所以就按照自己的思路从零实现一遍，过程讲解还是比较详细的，若是有不足之处还请指正。整体布局：登录： 菜单：准备工作：1、安装elementuinpm i element-ui -S
import ElementUI from
转载
2024-02-08 15:19:31
101阅读
项目介绍使用 vue 以及 element-ui 搭建一个 后台管理系统的模板。 纯属练手（写的比较糙 望指点）基本环境搭建 初始化项目使用 vue 以及 element-ui 搭建一个 后台管理系统的模板。 纯属练手（写的比较糙 望指点）1、初始化项目（babel vuex router eslint）vue create sandcms 2、等待 出现以下提示
转载
2024-04-03 13:20:15
76阅读
一、Element Form资料地址：https://element.eleme.cn/#/zh-CN/component/form下面以Form表单为例，介绍Element UI的使用。第1步：使用脚手架创建vue工程；vue create vue-form第2步：添加element插件。vue add element选择按需加载：第3步：在App.js文件中定义Form表单；<templ
转载
2024-04-21 18:04:52
101阅读
拟实现整体布局确定一下我们后台框架的整体布局，就来个基础经典的再看下实现之后的效果：接下来一步一步走：1、webstorm新建项目接下来就等系统创建好后直接npm run serve，我们得到了一个默认的vue项目2、在项目中引入Element-UI参考官方说明：我们进行npm安装安装完毕之后，我们在main.js中进行引入：参考官方说明：整体引入：3、利用el-container设置页面布局参考
转载
2024-04-11 11:51:46
188阅读
一、开始一）安装安装node.js下载网址：https://nodejs.cn/download/node -v #查看node版本
npm -v #查看npm版本，可以成功环境变量配置正确
npm config set registry http://registry.npm.taobao.org #设置npm为淘宝
npm config get regist
转载
2024-07-05 20:51:47
166阅读
