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.mzph.cn/pingmian/3966.shtml

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

相关文章

Vue 组件单元测试深度探索:组件交互与状态变更 专业解析和实践

在Vue组件单元测试中&#xff0c;验证组件之间的交互&#xff08;如父组件与子组件、兄弟组件之间的通信&#xff09;以及状态变更的正确性对于保证整个应用的协调运作至关重要。本文详细介绍了父组件向子组件传递props、子组件向父组件发送事件、兄弟组件通过共享状态&#xf…

自然语言处理 (NLP) 的技术演变史

一、简述 本文的目标是了解自然语言处理 (NLP) 的历史&#xff0c;包括 Transformer 体系结构如何彻底改变该领域并帮助我们创建大型语言模型 (LLM)。 基础模型&#xff08;如 GPT-4&#xff09;是最先进的自然语言处理模型&#xff0c;旨在理解、生成人类语言并与之交互。 要理…

国产3D自研技术如何突围?眸瑞科技给3D建设、管理带来全新模式

眸瑞科技是全球领先的数字孪生引擎技术及服务提供商&#xff0c;它专注于让一切3D模型在全网多端轻量化处理与展示&#xff0c;为行业数字化转型升级与数字孪生应用提供成套的国产自研3D可视化技术、产品与服务。 引言 眸瑞科技是全球领先的数字孪生引擎技术及服务提供商&…

【MyBatisPlus】一、公共字段填充配置

目录 一、实体类配置 二、配置MyBatis Plus元对象处理器 三、接口字段自动填充 在使用mybatisplus项目中设置公共字段填充&#xff0c;可以按如下进行配置 一、实体类配置 TableField(value "create_time",fill FieldFill.INSERT)private LocalDateTime createTime…

【C++】哈希思想

目录 哈希介绍&#xff1a; 一&#xff0c;位图 1-1&#xff0c;位图的认识 1-2&#xff0c;位图的简单实现 1-3&#xff0c;位图的应用 二&#xff0c;布隆过滤器 2-1&#xff0c;布隆过滤器的认识 2-2&#xff0c;布隆过滤器的简单实现 2-3&#xff0c;布隆过滤器的…

Kafka 3.x.x 入门到精通(06)——Kafka进阶

Kafka 3.x.x 入门到精通&#xff08;06&#xff09;&#x1f449;&#x1f449;&#x1f449;&#x1f449; Kafka进阶 3. Kafka进阶3.1 Controller选举3.2 Broker上线下线3.3 数据偏移量定位3.4 Topic删除3.5 日志清理和压缩3.7 页缓存3.8 零拷贝3.9 顺写日志3.10 Linux集群部…

Debian12使用宝塔国际aaPanel无法安装Docker

宝塔国际aaPanel自带安装Docker&#xff0c;安装了几次都失败&#xff0c;最后仔细看了安装日志&#xff0c;才发现其中的问题。 复制 --2023-11-28 13:42:13-- https://node.aapanel.com/install/0/docker_install_en.sh Resolving node.aapanel.com (node.aapanel.com)...…

Dockerfile镜像构建实战

一、构建Apache镜像 cd /opt/ #建立工作目录 mkdir /opt/apache cd apache/vim Dockerfile #基于的基础镜像 FROM centos:7 #维护镜像的用户信息 MAINTAINER this is apache image <cyj> #镜像操作指令安装Apache软件 RUN yum install -y httpd #开启80端口 EXPOSE 80 #…

从零开始利用MATLAB进行FPGA设计(五)详解双口RAM

创作于谱仪算法设计过程中的数字能谱生成模块设计。 往期回顾&#xff1a; 从零开始利用MATLAB进行FPGA设计&#xff08;四&#xff09;生成优化HDL代码 从零开始利用MATLAB进行FPGA设计&#xff08;三&#xff09;将Simulink模型转化为定点数据类型 目录 1.关于双口RAM …

php反序列化字符串逃逸

字符串逃逸 字符串逃逸是通过改变序列化字符串的长度造成的php反序列化漏洞 一般是因为替换函数使得字符串长度发生变化&#xff0c;不论变长还是变短&#xff0c;原理都大致相同 在学习之前&#xff0c;要先了解序列化字符串的结构&#xff0c;在了解结构的基础上才能更好理解…

低代码信创开发核心技术(四)动态元数据系统设计

一、概述 在当今快速发展的信息技术领域&#xff0c;动态元数据系统扮演着至关重要的角色。它不仅能够提供数据的描述信息&#xff0c;还能动态地适应业务需求的变化&#xff0c;从而提高系统的灵活性和可扩展性。构建一个动态元数据系统意味着我们可以在不重启系统的情况下&a…

硬件21、接线端子XH2.54、2.54排针排母、2510接插件、PH2.0、町洋接线端子5.08、ISP接口JTAG插座

XH2.54端子的间距为2.54毫米&#xff0c;2.54排针排母的间距也是2.54mm&#xff0c;2510接插件也是2.54、而PH2.0端子的间距为2.0毫米&#xff0c;町洋接线端子插针间的距离是5.08mm&#xff0c;ISP接口JTAG插座针脚的间距一般也是2.54mm XH2.54 针脚间距为2.54mm 插头 接线…

如何使用 Internet Download Manager (IDM) 来加速和优化你的下载体验 IDM 6.41下载神器

在当今信息爆炸的时代&#xff0c;下载文件和媒体内容已成为我们日常生活的一部分。无论是工作学习还是娱乐休闲&#xff0c;我们都需要从互联网上下载各种资源。为了提高下载效率和确保文件完整性&#xff0c;选择一款优秀的下载管理软件至关重要。Internet Download Manager …

浅谈游戏机制

浅谈游戏机制 前言什么是游戏机制&#xff1f;机制组成机制类别结语 前言 最近在编写游戏开发文档的时候了解到游戏机制&#xff0c;第一次接触游戏机制的概念难免有些陌生&#xff0c;但感觉又跟常见&#xff0c;在网上查阅浏览了一些资料后了解到游戏机制还不止一个。 现在将…

vue echarts 柱状图 堆叠柱状图

echarts堆叠柱状图&#xff08;效果图在文章末尾&#xff09; 1、默认只显示 月度的 数据&#xff0c;手动点击 legend 季度的 数据才会显示&#xff1b; 2、监听左侧菜单栏的宽度变化&#xff0c;图表宽度自适应展示 <template><div><div id"barChart&q…

构建数字化银行:现代化总架构探究

随着科技的迅速发展和用户需求的不断变化&#xff0c;传统银行业正迎来一场数字化转型的浪潮。在这个数字化时代&#xff0c;银行需要构建现代化的总架构&#xff0c;以适应快速变化的市场环境和客户需求。本文将深入探讨数字化银行的总架构设计理念、关键技术以及实践经验&…

乘数而上,创邻科技入选2024数商典型应用场景“乘数榜”

4月18日&#xff0c;由浙江省科学技术协会指导的2024未来数商大会在杭州成功举办。本次大会以“场景突破 乘数而上”为主题&#xff0c;国际国内数商共聚未来科技城学术交流中心&#xff0c;聚焦数据要素市场的制度创新、数据治理、场景应用与生态构建等话题展开研讨。 大会现…

软件需求管理规程(Word原件2024)

软件开发人员及用户往往容易忽略信息沟通&#xff0c;这导致软件开发出来后不能很好地满足用户的需要&#xff0c;从而造成返工。而返工不仅在技术上给开发人员带来巨大的麻烦&#xff0c;造成人力、物力的浪费&#xff0c;而且软件的性能也深受影响。所以在软件项目开发周期的…

StarRocks x Paimon 构建极速实时湖仓分析架构实践

Paimon 介绍 Apache Paimon 是新一代的湖格式&#xff0c;可以使用 Flink 和 Spark 构建实时 Lakehouse 架构&#xff0c;以进行流式处理和批处理操作。Paimon 创新性地使用 LSM&#xff08;日志结构合并树&#xff09;结构&#xff0c;将实时流式更新引入 Lakehouse 架构中。 …

什么ISP是住宅IP,和普通IP有什么区别?

ISP&#xff08;Internet Service Provider&#xff09;即互联网服务提供商&#xff0c;是向广大用户综合提供互联网接入业务、信息业务和增值业务的电信运营商。住宅IP&#xff0c;也称为家庭IP&#xff0c;是指由ISP分配给家庭或个人用户的IP地址。这些IP地址是真实的&#x…