2025年,Fantastic-admin 这款后台框架将继续引领潮流

news/2025/2/12 2:57:35/文章来源:https://www.cnblogs.com/hooray/p/18707209

前言

大言不惭的取了这个标题,但作为开发了 4 年多的 Fantastic-admin 的作者,回顾这一路走来,从一开始被指责抄袭,到现在拥有数百名付费用户和几十家付费企业。我认为我的开发理念应该是得到了大众的认可。

所以趁着 Fantastic-admin 发布 v5.0 之际,借由这篇文章回顾一下过去我做了哪些事。以及最近这一年,从 v4.0 到 v5.0 ,又带来了哪些改变。

叙叙旧

光听我在自夸,肯定有人不屑,那不妨先看看过去 Fantastic-admin 引领了哪些潮流?

仿 chrome 标签页样式

1737738499243.png

这个风格当然并非原创,我也是参考了 chrome 的标签页样式,但当时在 2020 年的后台框架里,Fantastic-admin还是第一个这么做的。

但是现在,vben / pure-admin / soybean-admin / shop-vite ,你叫得上名的,叫不上名的,几乎快成为大部分后台框架的标配了。

更直观的布局预览

1737739262175.png

1737739467753.png

我从 v2.0 开始就提供了这种更直观的布局预览,方便用户可以清楚的知道将使用哪种布局。

当然不仅仅这一处,和布局/样式相关的配置,我都尽量图形化、图标化,毕竟图案比起文字,更容易让人理解。

现在大部分后台框架,也都采用了这种方式,甚至直接借鉴了我的代码。

三方UI组件库可替换

我在 2023 年的时候提供了三方 UI 组件库可替换的特性,并且也专门整理了一篇文章《用1100天做一款通用的管理后台框架》,所以这里就不过多介绍了。

去年 vben 发布 5.0 的时候,发现他们也提供了这个特性,为此我还专门加了 vben 的作者。

因为当时我在设计这个方案的时候,也花了不少时间,所以当看到 vben 也提供了这个特性,这种开发理念上的默契,还是很让我感到开心的,并且也得到了 vben 作者的认可。

1737740667817.png

v4.0 -> v5.0

聊完了过去,那就来看看从 v4.0 到 v5.0 ,带来了哪些改变。

引入 shadcn-vue

2023 年 shadcn/ui 大火,我也是第一时间就关注到了,但很遗憾官方并没有提供 vue 的支持。

当时我在做三方 UI 组件库可替换的方案调研时,还没有出现 shadcn-vue,所以错过了 shadcn 。但用过 Fantastic-admin v4.0 的用户应该是能发现,虽然没有用上 shadcn ,但配色和样式和 shadcn 是非常相似了。

如今 shadcn-vue 也已经成熟可用,所以 v5.0 我直接引入了 shadcn-vue ,大量组件使用 shadcn-vue 进行了重新封装,并且还重写了登录界面,让替换 UI 组件库变得更容易了。

1737741971473.png

主题同步

用过 shadcn-vue 的应该都知道,shadcn-vue 提供的每一套主题,都包含了明暗两种配色。

Kapture 2025-01-28 at 02.21.50.gif

但它并不支持明暗模式下分别使用不同的主题,所以我专门增加了主题同步的特性,当关闭同步时,可以在明暗模式下分别使用不同的主题。

Kapture 2025-01-28 at 02.26.00.gif

登录过期弹窗

登录状态通常都有时效性,如果后端没有做 token 无感刷新,那么前端就可能出现用户在进行某个操作时,接口返回 token 过期,强制被登出并跳转到登录页。

针对在接口请求时触发登录过期,我专门增加了一个配置项,允许开发者可以开启登录过期弹窗,最大程度保留了当前操作的数据。

检查更新

虽然是web应用,刷新一下页面就可以看到最新版本,但如何通知用户刷新,也是一个问题。

所以我增加了一个最低成本的纯前端检查更新方案,当然如果有更复杂的场景,也提供的很方便的自定义。

全局预留插槽

大部分后台框架,核心功能都集中在了布局组件上,如下:

3b87e950352ac65c28724b22ebf2b21193138a6f.png

这意味着开发者如果要增加一些个性化的功能,就需要直接修改到框架的核心代码。这不仅增加了开发者的心智负担,而且后续对框架升级或者迁移代码,也会变得非常麻烦。

所以我增加了预留插槽这个特性,只需要创建约定文件名的组件,就能在不侵入框架核心代码的情况下,给布局组件中各个位置插入自定义内容。

更多插槽请查看

导航栏面板模式

相对于传统导航栏需要层层展开,面板模式可以更直观的看到所有导航菜单。

Kapture 2025-01-28 at 02.50.50.gif

更重要的一点是,无需修改任何配置,即可轻松在多种导航栏模式中切换。

小细节

除了上面这些能明显感知到变化的新特性,也有一些不起眼的小细节。

滚动遮罩

支持滚动的区域,超出部分都增加了一个淡出的遮罩,增强的用户交互体验。

Kapture 2025-01-28 at 03.04.37.gif

Kapture 2025-01-28 at 03.08.43.gif

其实从很早的版本就提供的类似的特性,只不过在 v5.0 中,将这这特性风格统一了,并且还封装成了一个独立的组件,方便开发者使用。

更合理的动效

主导航分别在顶部和侧边时,次导航的切换动效也做了区分。

你可以看到,当主导航在侧边时,从上到下依次点击,次导航的切换动效也是从底部向上滑入,反之亦然,就像你滑动鼠标滚轮一样符合直觉。

如果主导航在顶部时,次导航的切换动效则也变成了左右滑动。

Kapture 2025-01-28 at 03.06.07.gif

Kapture 2025-01-28 at 03.06.56.gif

总结

这篇文章介绍的功能还仅仅是 Fantastic-admin 众多功能里的冰山一角,如果你之前从未听说过 Fantastic-admin ,那么不妨来了解使用一下。

还是那句话,或许你正在使用其他的后台框架,或许你觉得后台框架大部分都大同小异,但我还是强烈建议你来了解一下 Fantastic-admin ,因为我依旧认为这是 2025 年最值得你上手使用的后台框架。

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

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

相关文章

“APS+”高级计划排程产品架构设计与功能分析

过去,企业以ERP数据或MRP数据为基石手动计划排程,在生产计划建议上无法实现高精准的交期预测、高效的资源调度管理。现在,企业在信息化的基础上集成APS高级计划排程,以助于其缩短订单生产周期、提高工作效率、降低库存成本,从而在战略上帮助企业实现供应链全流程产销协同一…

【技术文章】PostgreSQL分区表详细步骤

一、PostgreSQL分区表实现逻辑 1.1. 分区类型详解 PostgreSQL支持两种主要的分区类型: • 范围分区(Range Partitioning) 根据表中某一列的值范围将表分割成若干个分区。例如,我们可以按照时间字段(如日期)创建按年、季度或月份的范围分区。• 列表分区(List Partitioni…

某音逆向-纯算(一)

1 还是使用XHR定位(以抖音评论为例)2 添加日志断点清空控制台,禁用断点,放开断点。 启用断点后 点击打开二级评论,查看生成的日志3 加减乘数算法日志点 监测栈v[p]的变化,包括加减乘除,取余,位运算等运算参数和结果来推算加密算法。a_b参数是由其他参数加密而来,看到参…

本地一键运行大模型神器Ollama + DeepSeek R1尝鲜指南

本地一键运行大模型神器Ollama + DeepSeek R1尝鲜指南 作为AI领域的弄潮儿,你是否苦恼于云端大模型API的高昂成本?想在本机零门槛体验顶尖开源模型?这篇保姆级教程将带你解锁「Ollama+DeepSeek R1」黄金组合,文末附程序员专属玩法彩蛋! 一、Ollama:程序员的本地大模型…

吸烟识别摄像头

吸烟识别摄像头具备24小时不间断监测能力,可以随时发现违规吸烟行为。一旦检测到有人吸烟,系统会立即发出警报或通知管理人员。该系统能够自动生成统计报告,包括每日或每月的违规次数、时间分布以及常见地点等信息。这些数据为决策者提供了重要依据,有助于优化禁烟措施和宣…

社区垃圾分类识别AI算法盒

社区垃圾分类识别AI算法盒在社区垃圾投放站安装后,社区垃圾分类识别AI算法盒便能实时监测垃圾投放情况。当居民前来扔垃圾时,算法盒一旦检测到错误投放的垃圾,例如将可回收物扔进了其他垃圾桶,或者厨余垃圾没有破袋直接扔进垃圾桶等情况,它会立即启动语音提醒功能,清晰地…

在校大学生兼职新选择:轻松陪伴,日结!小乔陪玩平台兼职做陪玩达人(正规纯绿)请不要用异样的眼光看待新型事物

大学生兼职,玩伴兼职,小乔陪玩平台接单,兼职陪用户,看电影,逛街,吃饭.作为一名在校大学生,你是否曾经为生活费发愁?是否想过利用课余时间赚取一些零花钱,但又不想被繁琐的工作束缚?现在,机会来了!一种全新的兼职方式正在悄然兴起,它不仅轻松有趣,还能让你在享受生活的同…

这或许是全网最全的 DeepSeek 使用指南,95% 的人都不知道的使用技巧(建议收藏)

2025年春节过的好快,转眼间,大家又回到了各自工作岗位了,要说这个春节,什么最火,肯定绕不开DeepSeek。 几乎一夜之间,所有人都在关注DeepSeek,甚至我在老家,完全没用过AI的七大姑八大姨,都在问我,DeepSeek是什么,怎么用。 今天就来聊一聊DeepSeek,话不多说,开始。…

hot100-腐烂的橘子

思路 每个腐烂橘子向四周感染一次,直到没有新鲜橘子所需的最少时间。其中一定设计图的遍历,那么是DFS还是BFS?因为要求一层层感染完的最少时间,所以用BFS。即把腐烂橘子放入队列,每次感染一波出队,再把新感染的入队,直到所有腐烂橘子都向四周感染过一次。 为了判断是否有…

DeepSeek-Janus-Pro环境搭建推理测试

引子 北京时间1月28日凌晨,近期爆红的国产大模型DeepSeek在GitHub平台发布了Janus-Pro多模态大模型,这是继Janus发布之后的一次较大幅度升级。该款大模型是2024年11月13日发布的JanusFlow大模型的高级版本。相比前一代模型,Janus-Pro优化了训练策略、扩展了训练数据,模型也…

在 PyTorch 中理解词向量,将单词转换为有用的向量表示

你要是想构建一个大型语言模型,首先得掌握词向量的概念。幸运的是,这个概念很简单,也是本系列文章的一个完美起点。 那么,假设你有一堆单词,它可以只是一个简单的字符串数组。 animals = ["cat", "dog", "rat", "pig"] 你没法直接…

解决 virsh 无法通过 console 登录虚拟机

报错信息解决方法 登录虚拟机 通过 vnc 或者 ssh登录虚拟机 在虚拟机中执行已执行内容 echo "ttyS0" >> /etc/securetty echo "S0:12345:respawn:/sbin/agetty ttyS0 115200, 1152000 xterm" >>/etc/inittab grub2.cfg grep kernel /etc/grub2…