vue-element-admin 菜单标签失效的解决方式

设置菜单路由时，代码如下：

 {
  path: '/materieluse',
  component: Layout,
  meta: {
   title: '仓库管理',
   icon: 'component'
  },
  children: [{
   path: 'materielList',
   component: () => import('@/views/materieluse/materielList'),
   name: 'icons',
   meta: { title: '请料管理' }
  }, {
   path: 'itemDbList',
   component: () => import('@/views/materieluse/itemDbList'),
   name: 'icons',
   meta: { title: '项目仓库' }
  }]
 },

面板中的对应标签失效，经查资料，得知：name: "router-name"; //设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题,同时noCache: true 设置了也会失效

因此正确代码如下：

 {
  path: '/materieluse',
  component: Layout,
  meta: {
   title: '仓库管理',
   icon: 'component'
  },
  children: [{
   path: 'materielList',
   component: () => import('@/views/materieluse/materielList'),
   name: 'materielList',
   meta: { title: '请料管理' }
  }, {
   path: 'itemDbList',
   component: () => import('@/views/materieluse/itemDbList'),
   name: 'itemDbList',
   meta: { title: '项目仓库' }
  }]
 },

以上这篇vue-element-admin 菜单标签失效的解决方式就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 解决vue admin element noCache设置无效的问题

    1.后台返回的数据 { path: '/fbgq', name: 'fbgq', component: () => import('../views/part/fbgq.vue'), meta: { title: '发布供求', noCache:false } }, 2.对应vue文件fbgq.vue 要在script设置统一的name名称 export default { name:"fbgq", } 以上这篇解决vue admin element noCache设置无效的问题

  • vue.js element-ui validate中代码不执行问题解决方法

    vue.js element-ui validate中代码不执行问题解决方法

    先说结论 在自定义验证里面每一个判断都要有callback(),就是要保证callback()一定会执行到 因为要验证数字,参考了官网参考代码如下,发现有如下图bug,当输入为以数字开头包含字符串的内容时,验证不会报错,因为业务逻辑也不相符,随改写代码 <el-form-item label="年龄" prop="age"> <el-input v-model.number="ruleForm2.age"></el-

  • element-ui 设置菜单栏展开的方法

    element-ui 侧边栏默认要全部展开怎么做? element-ui文档中是这么写的 default-openeds 当前打开的sub-menu的key数组 给<el-menu></el-menu>标签加上这个属性 <el-menu class="el-menu-vertical" @open="handleOpen" @close="handleClose" theme="dark" :de

  • vue中element组件样式修改无效的解决方法

    如下所示: <style> .detail{ .el-input__inner { height: 48px; } } </style> 直接写style注意不加scoped,然后用一个组件最外层的class包裹住,就不会改到所有的组件的样式了. 以上这篇vue中element组件样式修改无效的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: Vue 组件间的样式冲突污染 浅谈vue中改elementUI默认样式引发的st

  • vue-element-admin 菜单标签失效的解决方式

    设置菜单路由时,代码如下: { path: '/materieluse', component: Layout, meta: { title: '仓库管理', icon: 'component' }, children: [{ path: 'materielList', component: () => import('@/views/materieluse/materielList'), name: 'icons', meta: { title: '请料管理' } }, { path: 'it

  • vue setInterval 定时器失效的解决方式

    正常情况下,在data里定义homeSetInterval 保存定时器的ID值 ,在销毁组件是使用clearInterval方法是可行的 但在使用了如下的keep缓存模式在使用销毁模式不行了 应该使用离开路由器前方法beforeRouteLeave 补充知识:vue中使用定时器的坑 我们在使用vue的脚手架去搭建开发环境的时候,在A页面写入一个定时器去定时请求一个接口,但是我们去B页面,C页面的时候都会有这个接口定时请求的现象,那么怎样处理呢? 第一步: 首先我在data函数里面进行定义定时器名

  • vue中touch和click共存的解决方式

    在vue开发手机端项目时,我们经常会遇到touch和click共存的情况,比如城市选择页面的字母滑动 touch事件在手机端会触发浏览器滑动,所以应给touch事件添加阻止默认行为touchmove.prevent.注意阻止默认行为事件不要添加在touchstart事件上,会影响到click事件的发生. touch事件和click事件发生先后顺序: touchstart,touchmove,touchend,click 补充知识:touchstart与click同时触发 产生冲突的原因 我们可以

  • vue+element表格实现多层数据的嵌套方式

    目录 vue+element表格实现多层数据嵌套 这是完成之后的 方法   vue+element表格实现多层数据嵌套 今天用element的表格渲染了商城的购物车列表,element的表格之前也用到过,它把所有的东西都封装好了, 这是完成之后的    只需要往里面传数据就可以了,通过prop来拿到相对应的字段,非常方便,但是天不尽人愿呐,后台接口返回的数据   是嵌套多了一层,直接上图,后台返回的数据结构    data下面是店铺的名字和id,orderItemList是店铺下面的商品,店铺要

  • vue element table表格相同名称列合并方式

    目录 element table表格相同名称列合并 对table表格相同内容行的合并 element table表格相同名称列合并 <template> <div> <el-table show-summary :summary-method="getSummaries" :span-method="objectSpanMethod" :data="tableData" row-key="id"

  • vue文本识别"\n"换行问题的解决方式

    目录 一.通过 css属性 实现 二.使用v-html实现 三.<pre>标签 附实践模块,温馨提示 基于vant改造 总结 在 vue 项目,有时请求返回的数据 中会有含有 \n 的字符串,如果直接渲染的话无法实现换行. 一.通过 css属性 实现 设置 white-space: pre-wrap;  代码如下: <div style="white-space: pre-wrap;">{{含有\n的字符串}}</div> 扩展: white-spa

  • @vue/cli4升级@vue/cli5 node.js polyfills错误的解决方式

    @vue/cli4升级@vue/cli5 node.js polyfills错误的解决方式

    目录 一.错误描述 二.错误日志 1.日志内容: 2.错误原因 3.解决方法[可以使用的方法] 4.解决办法[存在问题,需要研究还] 总结 一.错误描述 因前端项目做的少,今天用 vue脚手架创建项目选择了 @vue/cli 5.0 版本,在编译项目时出现如下错误: 二.错误日志 1.日志内容: 错误1: error  in ./node_modules/jwa/index.js Module not found: Error: Can't resolve 'crypto' in 'H:\iWo

  • Vue Element前端应用开发之菜单资源管理

    Vue Element前端应用开发之菜单资源管理

    1.菜单资源及管理界面介绍 前面介绍过,权限管理一般都会涉及到用户.组织机构.角色,以及权限功能等方面的内容,ABP框架的基础内容也是涉及到这几方面的内容,其中它们之间的关系基本上是多对多的关系,它们的关系如下所示. 加入菜单资源,以及整理它们之间的关系和表的信息,整理图示如下. 结合ABP后端提供的接口,Vue前端我们要实现基础的用户.组织机构.角色.功能权限等内容的管理,以及维护它们之间的关系.Vue前端对于权限管理模块的菜单列表如下所示. 菜单列表管理界面如下图所示,主要包括树状列表展示菜

  • 解决vue+element 键盘回车事件导致页面刷新的问题

    背景 今天发现输入框输入内容后回车就会刷新页面 解决 <el-form :inline="true" @submit.native.prevent> </el-form> el-from 加上 @submit.native.prevent 具体是参考element-ui文档解决的 W3C 标准中有如下规定: When there is only one single-line text input field in a form, the user agent

  • vue+element导航栏高亮显示的解决方式

    用导航菜单时遇到的一些问题:点击打开官网例子 问题1: 页面强制刷新,按F5时,页面如果没有好好设置的话,导航栏默认叠起来,而且无高亮显示:刷新后导航栏显示和之前不一致,如图所示 解决: html关键代码设置 :default-active="defaultUrl" 这儿的原理就是defaultUrl跟#/后面的一致,也就是说跟router.js中的path一致才行(router.js见后文) window.location.href.split('/#')[1] 获取的是"

随机推荐