LayuiMini使用时候初始化模板修改(下载源码)

 忘记加了 下载 地址 : layui-mini: layuimini,后台admin前端模板,基于 layui 编写的最简洁、易用的后台框架模板。只需提供一个接口就直接初始化整个框架,无需复杂操作。

LayuiMini使用时候初始化模板官网给的是:

    layui.use(['jquery', 'layer', 'miniAdmin'], function () {var $ = layui.jquery,layer = layui.layer,miniAdmin = layui.miniAdmin;var options = {iniUrl: "api/init.json",    // 初始化接口clearUrl: "api/clear.json", // 缓存清理接口urlHashLocation: true,      // 是否打开hash定位bgColorDefault: 0,          // 主题默认配置multiModule: true,          // 是否开启多模块menuChildOpen: false,       // 是否默认展开菜单};miniAdmin.render(options);});

可以看到 iniurl中 使用的是访问地址 如果直接传json就会报错 这是layuimini中写 不愿意修改源码 

那就只能从 init.json 文件路径中获取 或者  在数据库中 获取  自己写也行 官网得 拉过来 改改直接用也可以 

@Service
public class SysMenuServiceImpl implements SysMenuService {@Resourceprivate SysMenuRepository sysMenuRepository;@Overridepublic Map<String, Object> menu() {Map<String, Object> map = new HashMap<>(16);Map<String,Object> home = new HashMap<>(16);Map<String,Object> logo = new HashMap<>(16);List<SysMenu> menuList = sysMenuRepository.findAllByStatusOrderBySort(true);List<MenuVo> menuInfo = new ArrayList<>();for (SysMenu e : menuList) {MenuVo menuVO = new MenuVo();menuVO.setId(e.getKey().getId());menuVO.setPid(e.getPid());menuVO.setHref(e.getKey().getHref());menuVO.setTitle(e.getKey().getTitle());menuVO.setIcon(e.getIcon());menuVO.setTarget(e.getTarget());menuInfo.add(menuVO);}map.put("menuInfo", TreeUtil.toTree(menuInfo, 0L));home.put("title","首页");home.put("href","/page/welcome-1");//控制器路由,自行定义logo.put("title","后台管理系统");logo.put("image","/static/images/back.jpg");//静态资源文件路径,可使用默认的logo.png map.put("homeInfo", "{title: '首页',href: '/ruge-web-admin/page/welcome.html'}}");map.put("logoInfo", "{title: 'RUGE ADMIN',image: 'images/logo.png'}");return map;}
}

官网拉过来的 可以自己点击看

接口直接返回对应的json数据格式就ok了

但是如果不i想写后端 或者后端返回json数据格式嵌套得 可以换个想法:

嵌套的数据 处理后获取得json  或者 直接 把json数据放到js中得 

进行处理 办法 :

window.only  =  {//  模板json数据
}var blob  =  new Blob([JSON.stringify(window.only)], {type: 'application/json'})
var only = URL.createObjectURL(blob);var options = {iniUrl: only,    // 初始化接口clearUrl: "api/clear.json", // 缓存清理接口urlHashLocation: true,      // 是否打开hash定位bgColorDefault: 0,          // 主题默认配置multiModule: true,          // 是否开启多模块menuChildOpen: false,       // 是否默认展开菜单};

我是使用得其他js中存json 数据得 获取 把json 变成全局得 从需要调用得地方获取到需要得数据  window.only  当然如果使用 ES6 那就更加简单 用着也舒服 

我是使用的原始得 方法  (不是很推荐) 

遇到问题就是 访问的时候路径不好找 访问路径配置时候在 tomcat中 加入 名称 ‘http://localhost:8888/test’  不是 直接访问  http://localhost:8888/  这个地址 所以 遇到调用时候 怎么写路径都不会给加上 自己添加的 后缀 /test 所以需要自己手动添加上去 这个 路径问题 弄了 半天才找到问题所在 !!!

document.write('<script src="" type="text/javascript" charset="utf-8"></script>');

另外 如果使用 在其他js中存储json数据要注意  js 加载得顺序 不然获取不到数据 

document.addEventListener('DOMContentLoaded', (event) => {  // 在这里执行你的代码  // 此时 DOM 已经完全加载和解析,可以安全地访问和操作 DOM 元素  
});

 这个办法可以避免js得加载顺序 混乱  加载顺序可以在 开发者工具 (F12)中 网络里面看到 加载顺序

 

当然 后端直接获取是最简单的 这是 偷懒得办法  权限啥的都是 直接 js 走了  以后在修改 

如果权限会出现 那个不显示 那个显示得  最好是 是从后端判断 如果前端判断得话 稍微麻烦点 

但也不是不行 这个 可以 讨论交流交流得啊 

如果有什么问题 希望大佬们给提出来建议 !!!

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【目标检测】YOLOv7 网络结构(与 YOLOv4,YOLOv5 对比)

YOLOv7 和 YOLOv4 Neck 与 Head 结构对比 其实 YOLOv7 的网络结构网上很多文章已经讲得很清除了&#xff0c;网络结构图也有非常多的版本可供选择&#xff0c;因为 YOLOv7 和 YOLOv4 是一个团队的作品&#xff0c;所以在网络结构方面&#xff0c; YOLOv7 和 YOLOv4 有很多相似…

调度问题变形的贪心算法分析与实现

调度问题变形的贪心算法分析与实现 一、问题背景与算法描述二、算法正确性证明三、算法实现与分析四、结论 一、问题背景与算法描述 带截止时间和惩罚的单位时间任务调度问题是一个典型的贪心算法应用场景。该问题的目标是最小化超过截止时间导致的惩罚总和。给定一组单位时间…

Swift-27-类的初始化与销毁

Swift的初始化是一个有大量规则的固定过程。初始化是设置类型实例的操作&#xff0c;包括给每个存储属性初始值&#xff0c;以及一些其他准备工作。完成这个过程后&#xff0c;实例就可以使用了。 简单来讲就是类的构造函数&#xff0c;基本语法如下&#xff1a; 注意&#xff…

CentOS7/RHEL7 root密码破解

我们知道root是CentOS7/RHEL7系统的管理员用户&#xff0c;一般情况下&#xff0c;我们是不会把其密码忘记的&#xff0c;如果万一忘记了&#xff0c;如果破解root密码呢&#xff0c;今天就为大家详细讲讲。 1.CentOS7/RHEL7 root密码破解 以VMware虚拟机上CentOS7系统为例 …

毕业撒花 流感服务小程序的设计与实现

目录 1.1 总体页面设计 1.1.1 用户首页 1.1.2 新闻页面 1.1.3 我的页面 1.1.5 管理员登陆页面 1.1.6 管理员首页 1.2 用户模块 1.2.1 体检预约功能 1.2.2 体检报告功能 1.2.4 流感数据可视化功能 1.2.5 知识科普功能 1.2.6 疾病判断功能 1.2.7 出示个人就诊码功能 …

前端实现将二进制文件流,并下载为excel文件

目录 一、关于二进制流二、项目实践三、常见问题及解决 一、关于二进制流 含义&#xff1a;二进制流是一种计算机文件格式&#xff0c;它的数据以二进制形式存储&#xff0c;与文本文件不同。 二进制文件可以包含任意类型的数据&#xff0c;例如&#xff1a;图像、音频、视频…

在浏览器输入网址,Enter之后发生了什么?

在浏览器输入网址&#xff0c;Enter之后发生了什么&#xff1f; 很多八股文会给出&#xff1a; 1. DNS Resolution2. Establishing a Connection3. Sending an Http Request4. Receiving the HTTP Response5. Rendering the Web Page 但今天我斗胆插入第0.9步URL Parsing&#…

大模型产业盛典上石景山智能算力中心绽放新光芒

2024年4月16日&#xff0c;由中关村数智人工智能产业联盟主办的“2024人工智能大模型产业发展大会”圆满闭幕。在这场盛会中&#xff0c;企商在线石景山智能算力中心以其作为北京最大规模的公共智能算力中心的身份亮相&#xff0c;为首都建设全球数字标杆城市注入了新的活力。 …

Chrome 网络调试程序 谷歌网络调试 network

目录 1.网络面板总览2.概况了解3.Waterfall接口排队等待时间4.关注请求接口的Size,可能是占据内存溢出的接口5.过滤器一栏 fetch/xhr 什么意思6. Stalled 什么意思7.Queueing 什么意思8.Queueing和Stalled之间什么关系9.为什么会有阻塞状态10.Time列是pending 什么意思 1.网络面…

信息系统项目管理师0066:过程管理(5信息系统工程—5.1软件工程—5.1.6过程管理)

点击查看专栏目录 文章目录 5.1.6过程管理1.成熟度模型2.成熟度等级5.1.6过程管理 软件过程能力是组织基于软件过程、技术、资源和人员能力达成业务目标的综合能力。包括治理能力、开发与交付能力、管理与支持能力、组织管理能力等方面。软件过程能力成熟度是指组织在提升软件产…

如何提取单片机片内程序的值进行拷贝?

对于许多单片机&#xff0c;其固件是由制造商保护的&#xff0c;并且未经授权的访问、拷贝或修改可能侵犯法律。我这里有一套嵌入式入门教程&#xff0c;不仅包含了详细的视频 讲解&#xff0c;项目实战。如果你渴望学习嵌入式&#xff0c;不妨点个关注&#xff0c;给个评论222…

【经验总结】Jupyter 配置内核

1. 背景描述 使用 国家超算互联网中心 的服务器&#xff0c;创建 jupyterlab 容器&#xff0c;想在之前 conda 创建的环境中运行&#xff0c;可是不行&#xff0c;进入容器就直接进入 jupyterlab 2. 解决方法 配置内核 2.1 激活环境 conda activate peft2.2 安装内核 pip…