我的 Next.js 博客 有了多种主题切换功能

书接上文 成功将 Hugo 博客迁移到 Next.js, 很清爽的一个博客主题

尽情参观:https://blog.taoluyuan.com/

这次完成 Next.js 博客多主题切换功能, 总共 5 个主题, 包括暗黑模式

采用了技术

• next-themes 实现主题状态切换

• 用了 daisyui 四个主题

• 暗黑 dark 模式是自己配的

• 兼容了原模板 themetailwindcss 的 dark:*** 各种样式

关于 next-themes

• 大概看了下 next-themes 原理是 使用 useState 来维护当前选定的主题
• 调用 next-themes 提供的 setTheme 函数时, 它会更新内部的主题状态
• 这时就能切换到对应的 daisyui 样式

打算将 next-themes 配合 daisyui 切换主题功能, 单独抽离出来做成一个单页面 next.js 示例

尽情参观:https://blog.taoluyuan.com/