当前位置: 首页 > Web前端 > HTML5

D2Admin七月更新内容:cli3和更方便的全局控制等

时间:2023-04-05 12:40:44 HTML5

时间过得真快。1.1.4发布已经一个月了。这个月每天还是很忙。D2Admin也进行了重大重构。下面介绍一下1.1.5相比1.1.4的大变化~重要升级vue-cli3D2Admin这次完成了对vue-cli3的重构,省去了之前繁琐的webpack配置,打包速度更快。环境变量设置更简单,文件目录更简洁。d2-container组件重构对创建页面最重要的d2-container组件进行了重构,详见pagecontainer,依然支持full+card+ghost三种模式,不同的是现在三种模式分别支持header和footerSlots,都支持切换自定义滚动条,并提供滚动条设置的道具。type="full"type="card"type="ghost"在页面容器文档中,我也针对三种模式的各种可能性做了很多说明x是否有slotx是否启用滚动条优化,欢迎访问文档站点视图。在线示例(请先完成一个登录)布局容器页面缓存逻辑优化首先承认一个错误:在1.1.4中,多标签页的缓存逻辑有问题,导致即使多标签页-页面控制组件关闭,页面仍在缓存中。页面缓存逻辑在1.1.5中被重写并修复了这个错误。开启多标签页控件在1.1.4中,多页控件的逻辑部分写在控件组件中,部分写在vuex中,使用方法不公布。在1.1.5中,所有的页面控件被重新组织并放入vuex中,并给出了所有文档和示例,这意味着如果你需要,你可以使用这些API来控制多标签页的打开和关闭。API函数d2adminPageOpenNew打开新页面d2adminTagClose关闭页面d2adminTagCloseLeft关闭当前页面左侧页面d2adminTagCloseRight关闭当前页面右侧页面d2adminTagCloseOther关闭除当前页面之外的其他页面菜单的数据切换在主布局组件中完成,导致很多朋友问我二次开发的时候怎么修改菜单设置。为了解决这个问题,1.1.5新开了顶栏菜单和侧栏菜单。控件API:API函数d2adminMenuHeaderSet设置顶栏菜单d2adminMenuAsideSet设置侧栏菜单举个栗子,现在可以这样设置://任意位置//menuHeader是处理完的菜单数据$store.commit('d2adminMenuHeaderSet',menuHeader)//顶栏菜单更新就这么简单。在线示例(请先完成登录)菜单控件详见VUEXutilitycookie读写封装API函数util.cookies.setsetcookie不直接使用cookie?util.cookies内部使用js-cookie进行操作,在cookie名称上加了一层逻辑封装,例如util.cookies.set({name:'name',value:'value',setting:{expires:365}})实际存储的cookie是d2admin-${version}-name:value其实是用util.cookies.get('name')取的也是d2admin-${version}-name最后你的cookie信息可能实际上类似这样(例如):d2admin-1.1.5-name:FairyEverd2admin-1.1.5-uuid:h8dsafy98du9f6yadsyfd2admin-1.1.5-token:dys87f89dsafy89adsh这样做的好处是如果你的D2Admin升级到新版本,打开时会用到数据,必须重新初始化,而当你使用cookies时,无论你赋值还是取值,你都不会察觉到这层包装。具体参见UtilUtility数据持久化优化数据持久化现在提供了一个新的API用于二次开发API函数d2adminUtilVuex2DbByUuid根据用户区分持久化store的某个值d2adminUtilDb2VuexByUuid根据用户区分恢复持久化store的某个值d2adminUtilVuex2DbCommon给所有用户持久化store的某个值d2adminUtilDb2Vuex所有用户通用恢复持久化store的某个值用户的持久化区d2adminUtilDatabaseUserClear清除当前用户的持久化区d2adminUtilDatabase获取所有用户的通用持久化区持久性区域d2adminUtilDatabaseClear清除所有用户共有的持久性区域使用这些API可以做什么?在商店中持久化一个项目可以区分用户与否。随意保留任何数据。可以区分用户存储,也可以存储为所有用户共享。详见VUEX实用程序在线示例(请先完成登录)userData公共数据自动收集用户浏览器信息,无需任何操作,可在商店获取用户浏览器信息。示例数据格式:{browser:{name:"Chrome",version:"67.0.3396.99",major:"67"},engine:{name:"WebKit",version:"537.36"},os:{name:"MacOS",version:"10.13.4"},device:{},cpu:{}}侧边栏控制API函数d2adminMenuAsideCollapseSet设置侧边栏收缩或展开d2adminMenuAsideCollapseToggle切换侧边栏状态,现在侧边栏的状态将会自动持久化,也就是说刷新浏览器后侧边栏会一直快速收缩或者快速展开入门章节为了方便大家使用D2Admin搭建首页,新增了“快速入门”章节写好了,后续会出一系列教程前置知识准备下载项目安装环境安装依赖开发调试新建页面设置路由设置菜单效果资源查看快速启动其他更新信息查看下一节更新日志管理设计优化【修改】多标签页操作全部转入tovuex[修改]修复多标签页无法清除缓存的bug[修改]bugfixed#38[修改]bugfixed#41[修改]SidebarandtopbarMenu数据控制转移到vuex集中管理[修改]页面最小宽度设置[新增]d2-highlight组件新增format-h??tml参数[新增]自动获取用户浏览器UA[新增]playground新增浏览器信息查看界面[修改]登录退出逻辑移至vuex[新增]新增快速用户示例登录页面选择[新增]侧边栏切换控件移至vuex[新增]判断手机浏览自动跳转到提示页面[修改]]侧边栏弹出菜单尺寸缩小以容纳更多菜单[修改]的d2-container组件重构,各模式支持滚动属性和页眉页脚槽[修改]修复全屏按钮退出全屏状态不更新的bug[修改]修复多tab缓存逻辑bug[新增]持久化存储根据系统版本区分数据,防止更新造成数据混乱[新增]登出画面灰度效果[新增].el-card有随主题变化的风格[新增]移植ElementUI表格组件的所有示例[新增]全局状态管理游乐场[新增]用户私有持久数据游乐场[新增]侧边栏和顶部栏菜单设置游乐场[新增]d2-container组件卡片模式下页脚样式优化【修改】缩小侧边栏折叠模式下弹出菜单的大小【修改】默认取消侧边栏自定义滚动条显示【新增】cookie读写封装【新增】]持久存储读写包装器,提供突变用于快速操作当前用户数据[新增]持久存储读写包装器,提供突变用于快速操作所有用户共享的数据根据??用户区分记录,刷新页面即可节省保持之前的状态,一些额外的东西被“引用”。总结总是不愉快。首先感谢那些给我提意见和帮助的朋友(包括精神鼓励和红包鼓励)。大家的star也是对我的鼓励。在人力有限的前提下,我会尽力把D2Admin做的更好。现在我只能向你保证:以后会有你该有的。这个项目会继续努力,以后会给大家带来更多惊喜的更新。关于接下来的计划以及其他正在进行的计划,暂时保密,敬请期待!既然做了,就要做好,做好。项目地址地址说明团队主页D2Admin团队主页中文文档中文文档完整版预览地址完整版预览地址完整版github完整版Github仓库完整版代码云完整版代码云镜像仓库精简版预览地址精简版预览地址精简版github简体版本Github仓库精简版码云精简版码云镜像仓库在最后,如果大家看了觉得还不错,希望大家在项目首页点个星,作为对本项目的认可和支持,谢谢.