若依vue-新建目录及菜单

news2024/11/28 12:43:31

前面我们把标题和logo换成了自己系统的标题和logo了

接下来就是要建立自己需要的菜单和页面

新建目录解析

在拉下来的代码跑起来后 有一个系统菜单--菜单管理(如图)

在这个菜单的这个页面内有对应的操作功能

修改功能

这个功能可以修改写好了的菜单数据 例如:名称/排序/路由地址/状态

如果是系统自带的菜单 如果不需要 就可以把菜单的状态切换到 '停用'

如果是自己新增的菜单 这个功能可以修改排序 调整菜单在左侧的位置

删除功能

这个功能就是把自己已经写好的菜单删除掉(不建议使用,如果某个菜单不用了可以停用)

系统自带菜单是无法删除的 只能停用

新增功能

有两个新增

一个是表单左上角的新增 主要是新增菜单

第二个是表单列表的操作新增 主要是新增页面和按钮等

但是其实两个无区别

新增目录

上级菜单:

这个主要是选择菜单所处的层级 如果是主类目就是一级菜单 还可以选择一级菜单下面的菜单 作为它的二级菜单

菜单类型:

有三个类型 分别是 目录 菜单 按钮

今天主要讲讲目录和菜单

可以发现 点击目录和点击菜单 所新增的画面是不一样的

因为目录是一级分类 而菜单是下面对应的页面,需要设置对应的路径和权限等信息

菜单图标:

选择菜单名称前面的小图标

可以在源文件内添加自己需要的图标再选择

菜单名称:

显示的目录/菜单名称

显示排序:

就是目录/菜单的展示顺序 基本是从1开始向后排序

是否外链:

如果选择 则路由地址需要以 'http(s)://' 开头

路由地址:

访问的动态路由地址 比如 'user'

显示状态:

选择隐藏 则该路由不会出现在左侧边栏 但是可以通过路由去访问

菜单状态:

选择停用 则该路由不会出现在左侧边栏 并且不能访问

新增菜单

由于新增菜单和新增目录有重合的 所以这里只写不重合的地方

组件路径:

访问的组件路径 例如: 'system/user/user' 默认是在'views'目录下的

权限字符:

控制器中定义的权限字符

路由参数:

访问路由的默认传递参数 比如 '{"id": 1, "name": "admin"}'

是否缓存:

选择是 则会被 'keep-alive'缓存 需要匹配组件的 'name' 和地址保持一致

新建目录/菜单

新建目录

在添加对应的目录/菜单后 还需要手动的在源文件内去添加对应的路径

比如说 新增了一个用户目录 'user'

就需要在 src/views 文件下面新增一个文件 'user' 来充当目录

新建菜单

这个在前面添加的时候 就需要配置好动态路由并且加进去

例如我在添加的时候 组件路径为 'user/user/index'

就需要在文件对应路径添加对应页面

index.vue就是该菜单会展示的内容

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1300310.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Leetcode—337.打家劫舍III【中等】

2023每日刷题(五十二) Leetcode—337.打家劫舍III 算法思想 实现代码 /*** Definition for a binary tree node.* struct TreeNode {* int val;* TreeNode *left;* TreeNode *right;* TreeNode() : val(0), left(nullptr), right(null…

【Qt开发流程】之容器类2:使用STL风格迭代器进行遍历

概述 对于每个容器类,都有两种stl风格的迭代器类型:一种提供只读访问,另一种提供读写访问。应该尽可能使用只读迭代器,因为它们比读写迭代器快。 STL迭代器的API以数组中的指针为模型。例如,操作符将迭代器推进到下一项&#xf…

Leetcode刷题笔记题解(C++):25. K 个一组翻转链表

思路&#xff1a;利用栈的特性&#xff0c;K个节点压入栈中依次弹出组成新的链表&#xff0c;不够K个节点则保持不变 /*** struct ListNode {* int val;* struct ListNode *next;* ListNode(int x) : val(x), next(nullptr) {}* };*/ #include <stack> class Solution { …

OpenAI承认ChatGPT变懒惰,正在修复该问题

OpenAI旗下的官方ChatGPT账号在社交平台表示&#xff0c;已经收到了大量用户关于GPT-4变懒惰的反馈。 这是因为自11月11日以来&#xff0c;OpenAI就没有更新过该模型。当然这不是故意的&#xff0c;大模型的行为是不可预测的&#xff0c;正在研究修复该问题。 外界猜测&#x…

AirServer Mac7.27中文破解2024最新图文安装激活教程含许可证

AirServer Mac 7.27中文破解是一款便捷式投屏软件&#xff0c;它的主要功能在于实时地将移动设备上的图像画面内容投放到电脑设备上&#xff0c;让电脑成为iPad、iPhone等iOS系统设备的大屏显示器。 在设备之间建立局域网内的信号发送与接收通道&#xff0c;确保数据可以稳定安…

(JAVA)-IO流-序列化流

序列化流&#xff1a;能把java的对象写到本地文件中 构造方法 public class test {public static void main(String[] args) throws IOException {student snew student("邓子",19);ObjectOutputStream oosnew ObjectOutputStream(new FileOutputStream("D:\\a…

LAMP和分离式LNMP部署

目录 一.什么是LAMP&#xff1f; 二.安装LAMP 先安装apache&#xff0c;httpd网页服务&#xff1a; 接着安装mysql&#xff1a; 安装php&#xff1a; 创建论坛&#xff1a; 三.安装分布式LNMP&#xff1a; 先安装nginx&#xff1a; 到另一台主机安装php&#xff1a; …

我有才专属定制适合个人的知识付费平台,打造个性化品牌与自主管理体验

在当今数字化时代&#xff0c;知识付费平台已经成为人们获取专业知识、提升自身素质的重要渠道。然而&#xff0c;公共知识付费平台虽然内容丰富&#xff0c;但难以满足个人或企业个性化的需求和品牌打造。因此&#xff0c;我们提出了专属定制适合个人的知识付费平台的概念&…

win11 CUDA(12.3) + cuDNN(12.x) 卸载

win11 CUDA&#xff08;12.3&#xff09; cuDNN&#xff08;12.x&#xff09;卸载 信息介绍卸载 信息介绍 本文是对应 win11RTX4070Ti 安装 CUDA cuDNN&#xff08;图文教程&#xff09; 的卸载 卸载 控制面板 --> 程序 --> 卸载程序 卸载掉图中红框内的&#xff0c…

题目:纪念品分组(蓝桥OJ 532)

题目描述&#xff1a; 解题思路&#xff1a; 本题使用贪心思想&#xff0c;先排序&#xff0c;则最大和最小就分别位于头部和尾部。如果最大和最小之和不超过容量&#xff0c;就取两个放到一个&#xff08;ans&#xff09;并去除&#xff1b;如果最大和最小之和超过容量&#x…

模型 心流

本系列文章 主要是 分享模型&#xff0c;涉及各个领域&#xff0c;重在提升认知。完全投入其中。 1 心流的应用 1.1 优秀运动员的心流体验 迈克尔乔丹&#xff08;Michael Jordan&#xff09;&#xff1a;篮球之神乔丹在比赛中经常进入心流状态&#xff0c;他曾表示&#xff…

低代码是你得菜吗?传统编程如何应对低代码的挑战?有哪些优秀的低代码平台?

低代码开发是一种越来越受到关注的软件开发方式&#xff0c;它旨在通过简化和加速应用程序开发过程来降低编程门槛。随着技术的进步和对快速交付的需求增加&#xff0c;低代码平台提供了一个快速构建应用程序的环境&#xff0c;无需深入的编程知识&#xff0c;使非专业开发人员…

linux7安装python3.12.1教程

1.下载tar.gz包 地址&#xff1a;Python Release Python 3.12.1 | Python.org 2.上传包到linux服并解压 cd /home/local/ ll tar -zxvf Python-3.12.1.tgz 3.安装编译python所需环境 yum install -y gcc yum install -y zlib* yum -y install zlib-devel bzip2-devel opens…

tidb安装 centos7单机集群

安装 [rootlocalhost ~]# curl --proto https --tlsv1.2 -sSf https://tiup-mirrors.pingcap.com/install.sh | sh [rootlocalhost ~]# source .bash_profile [rootlocalhost ~]# which tiup [rootlocalhost ~]# tiup playground v6.1.0 --db 2 --pd 3 --kv 3 --host 192.168.1…

ThreadLocal类的实例解析以及常用方法通过具体案例了解ThreadLocal的基本使用

目录 前言 一、ThreadLocal 分析 二、ThreadLocal的基本使用 三、实现原理 四、存在问题 1.引用 2.问题详情 3.解决方案 五、章末 前言 小伙伴们大家好&#xff0c;谈到多线程就不可不谈解决线程安全 的操作类ThreadLocal了 一、ThreadLocal 分析 ThreadLocal会为每个…

Linux实用操作

一、各类小技巧&#xff08;快捷键&#xff09; 1.1 ctrl c 强制停止 Linux某些程序的运行&#xff0c;如果想要强制停止它&#xff0c;可以使用快捷键ctrl c 命令输入错误&#xff0c;也可以通过快捷键ctrl c&#xff0c;退出当前输入&#xff0c;重新输入 1.2 ctrl d…

Linux C/C++ 从内存转储中恢复64位ELF可执行文件

ELF&#xff08;Executable and Linking Format&#xff09;是一种对象文件的格式&#xff0c;它主要用于定义ELF&#xff08;Executable and Linking Format&#xff09;是一种对象文件的格式&#xff0c;它主要用于定义不同类型的对象文件中的内容以及它们的存储方式。一个EL…

Jenkins参数化构建及代码发布

如何使用gitlab--web端可以观看此篇教程 https://blog.csdn.net/m0_59933574/article/details/134528050?spm1001.2014.3001.5502https://blog.csdn.net/m0_59933574/article/details/134528050?spm1001.2014.3001.5502 整体思路 依赖环境及工具 Git Centos7及以上 Gitla…

【利用二手车数据进行可视化分析】

利用二手车数据进行可视化分析 查看原始数据去除重复数据需求分析1.统计全国总共有多少量二手车&#xff0c;用KPI图进行展示2.统计安徽总共有多少量二手车&#xff0c;用KPI图进行展示3.统计合肥总共有多少量二手车&#xff0c;用KPI图进行展示4.取最贵的10辆二手车信息&#…

STM32——继电器

继电器工作原理 单片机供电 VCC GND 接单片机&#xff0c; VCC 需要接 3.3V &#xff0c; 5V 不行&#xff01; 最大负载电路交流 250V/10A &#xff0c;直流 30V/10A 引脚 IN 接收到 低电平 时&#xff0c;开关闭合。