vue-admin-template引入快捷标签导航栏 routes of undefind 报错问题

最新推荐文章于 2023-04-18 09:36:23 发布
最新推荐文章于 2023-04-18 09:36:23 发布
阅读量413 收藏
点赞数
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43144773/article/details/112532926
版权

在这里插入图片描述

这里主要说两个方法。
方法一丶关闭路由权限
在@layout/components/TagsView/index中找到initTags()
在这里插入图片描述
把红框中的this.filterAffixTags(this.routes)改成 []，得到如下图
在这里插入图片描述
这样就不会报错了。

方法二丶修改store下的index.js，增加permission文件并引入，直接贴代码
在这里插入图片描述
或者直接拷贝vue-element-admin中的store/index文件
在这里插入图片描述

之所以会报 routes of undefind，是因为在@layout/components/TagsView/index的computed属性中调用了
state中的permission，但实际vue-admin-template的store/modules并没有permission这个文件，也就没办法在state中引用。
在这里插入图片描述

大头不爱吃鱼
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
两小时从零学会vue-admin-template框架
drhrht的博客
03-06 6615
一、vue-admin-template 1.项目简介 官网：https://github.com/PanJiaChen vue-element-admin是含有丰富的组件，vue-admin-template是一个基础的单页面应用的框架，适合在vue-admin-template上二次开发，开发需要的组件就可以直接的从vue-element-admin里面拷贝上去。适合于后台管理的中小型项目，内部的架构非常的完善，简单易上手。 1.2下载项目 vue-element-admin 官网 vue-admi
vue-admin-template 动态路由的实现（方式一）
m0_70274530的博客
04-29 1957
name: ‘AddBanner’, component: () => import(‘@/views/appmanage/addbanner/index’), meta: { title: ‘添加Banner’, icon: ‘’ } } ] }, { path: ‘/createactivationcode’, hidden: true, component: Layout, children: [ { path: ‘index’, name: ‘CreateActivationCode’, co
vue-admin-template配置快捷导航的代码（标签导航栏）
10-14
主要介绍了vue-admin-template配置快捷导航的方法（标签导航栏），本文通过实例代码给大家介绍的非常详细，对大家学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
项目笔记9：vue-admin-template框架使用
Sky_rabbit94的博客
04-10 323
流程： 1、现在rooter下的index.js添加路由，比如页面左侧菜单栏 2、在index.js文件中，添加路由对应的界面，界面在view-tree下创建（index.vue） 路由关联界面代码： component: () => import('@/views/login/index') 3、在api下创建js，定义接口地址和参数： import request from '@/utils/request' export function login(username, pas
vue-admin-template引入快捷标签导航栏
qq_40099034的博客
04-09 795
参考：https://blog.csdn.net/sinat_34346372/article/details/108359434 1、添加标签 @/layout/components/AppMain.vue添加： <template> <section class="app-main"> <transition name="fade-transform" mode="out-in"> <keep-alive :include="cachedVie
vuex+vue-router拦截
weixin_30245867的博客
06-25 143
干就完了 项目中经常遇到这样一个场景，用户信息或者进行增删改的一些模块，需要根据用户是否登录，进行路由拦截，直接上代码 在store文件夹下的store.js中存放一个默认登录状态 /* * store.js * */ import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const state = { user:...
vue-admin-template小型后端管理系统node访问小程序云函数步骤流程(系列五)
laimaodashuaige的博客
12-23 562
1.首先在当前目录的src-api的文件夹中创建名：getsum.js并写入代码，因为我们这个是获取后端服务的所以尽量写在api的文件夹中。 2.我们敲入代码如下： import request from '@/utils/request' // 引入当前自带的request const url = 'http://localhost:3000' // 定义url访问的链接 export function getsum(params) { // 创建方法params为传入的参数 return requ
vue-admin-template 动态路由的实现（方式一），flutter通知推送
m0_65485622的博客
12-28 992
hidden: true, component: Layout, children: [ { path: ‘index/:id’, name: ‘AddBanner’, component: () => import(’@/views/appmanage/addbanner/index’), meta: { title: ‘添加Banner’, icon: ‘’ } } ] }, { path: ‘/createactivationcode’, hidden: true, component: Lay
element-ui+vue-router:实现导航栏跳转路由
热门推荐
nahedan的博客
10-27 1万+
在实际开发中我们常常遇到在单页面中点击导航栏菜单中的某一选项卡，页面中的某个部分出现相关的信息，也就是使用导航栏进行路由跳转。如下图所示（在线格式转换）。 ### 示例 <el-menu :default-openeds="['1', '3']" :default-active="this.$route.path" router > <div class="icon"> <i class="el-icon-im
vue多页面router路由报错？TypeError: Cannot read property ‘matched‘ of undefined“
Mgf_Yzy的博客
02-21 265
Vue多页面配置路由要报错？是不是向我这样，刚好这份纠错值得你收藏 话不多说，直接上图，你是不是也随便用一个变量名接收router.js文件，那你可就错了，这里官方有指定的变量名（router），其他的一律报错 你变量名换过来之后在试试，是不是还和我的效果一样 如果和我一样，那就恭喜你debug成功，不然你就认真检查是不是单词拼错了，也可以留言，在线为你解答 ...
Vue3标签页（Tabs）
最新发布
Mr Dear的博客
04-18 7035
选项卡切换组件，支持：卡片式标签页；禁用某一项；居中展示；左右滑动；三种尺寸；自定义内容；总之，功能丰富，简单易用😁😁
vue-admin-template导航栏路由功能
qq_41950447的博客
04-19 1481
前面登录功能已经实现了https://blog.csdn.net/qq_41950447/article/details/115870228，后端接口已经设置好了，跨域问题已经解决，下面写路由 点击相应的导航栏展示设置的内容 1.添加路由 首先在router->index.js中路由根据已有的例子进行改写 //添加讲师列表路由实现 { path: '/teacher', component: Layout, redirect: '/teacher/tabl..
vue设置标签名称_vue element Admin - 修改浏览器标签名 + 添加tagView标签 +固定导航头部 + 添加侧边栏Logo...
weixin_39815435的博客
01-30 773
1 、修改浏览器标签名称：修改浏览器标签名称在文件：\src\settings.jsimage.png2 、修改固定头部Header和侧边栏 Logo：image.png1)侧边栏文件在：\src\layout\components\Sidebar\index.vue， Sidebar组件中image.png2)修改侧边栏Log和标题在文件：src\layout\components\Sideba...
Vue中$store引入undefined
Chris__Feng的博客
01-31 606
使用vuex中state传值，利用this.$store显示undefined
vue-admin-template 配置快捷导航
搞笑范fan
12-01 764
vue-admin-templat 快捷导航配置
element admin 中动态设置快捷导航(标签栏导航)meta标签和title标签
lchmyhua88的博客
11-20 2769
element admin 中动态设置快捷导航(标签栏导航)meta标签和title标签
vue-admin-template引入快捷标签导航栏出现的问题，请求指教
weixin_43395008的博客
06-06 2794
vue-admin-template 导航栏修改hover
03-29
要修改 vue-admin-template 中的导航栏 hover 样式，可以按照以下步骤操作： 1. 打开 `src/styles/element-variables.scss` 文件，找到 `$--color-primary-hover` 变量，将其值修改为你想要的颜色值。 2. 打开 `src/styles/mixins.scss` 文件，找到 `el-menu-item-active` 类的样式，修改其中的 `background-color` 和 `border-color` 属性为你想要的颜色值。 3. 打开 `src/layout/components/Sidebar/index.vue` 文件，找到 `<el-menu>` 标签，将其中的 `@hover-background-color` 属性值修改为 `$--color-primary-hover`。 这样就可以修改 vue-admin-template 中导航栏 hover 样式了。记得重新编译项目以使修改生效。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值