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

前言

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

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

叙叙旧

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

仿 chrome 标签页样式

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

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

更直观的布局预览

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

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

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

三方UI组件库可替换

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

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

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

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 组件库变得更容易了。

主题同步

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

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

登录过期弹窗

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

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

检查更新

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

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

全局预留插槽

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

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

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

更多插槽请查看

导航栏面板模式

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

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

小细节

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

滚动遮罩

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

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

更合理的动效

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

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

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

总结

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

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