2025年1月4日 Nuxt3使用keepalive缓存页面后, 切换不同布局, watch可能重复调用的问题 Nuxt3对于页面缓存的实现很简单, 在app.vue的NuxtPage组件上添加一个keepalive就可以实现了 但是如果你的两个页面是不同的布局, 这个缓存可能会失效, 同时也会带来一个小问题 以下是一个简单的页面 通过点击上面的模块按钮, 切换模块, 这里会监听模块的切换, 输出"我被请求了" 目前是没有问题的, 点击切换, 方法只会执行一次 ... 阅读约需 3 分钟 · 前端 查看更多 →
2024年12月31日 Nuxt3 使用Arco Design组件库简单地实现动态切换主色 Arco Design的主颜色默认使用css变量指向了他们的Arco Blue 蓝色 最近写东西刚好需要在前端打包完以后也能根据后台的颜色配置替换主色, 如果你也需要, 这个文章获取可以帮到你 所以只要在body上面替换这些变量就可以轻松的实现替换Arco Design主色 我的思路就是我们输入一个主色, 然后利用js生成10个色阶, 将10个颜色替换进去就可以了 ... 阅读约需 5 分钟 · 前端 查看更多 →
2024年12月29日 Nuxt3按需引入Arco Design 前段时间打算给一个项目用NaiveUI来写的, 但是今天写着写着发现他们的响应式栅格在SSR框架会出现抖动和水合的问题, 应该有解决办法, 但是我太菜了, 只好换一下框架😂 引入步骤 1. 安装依赖 # npm npm install --save-dev @arco-design/web-vue # yarn yarn add --dev @arco-design/web-... 阅读约需 2 分钟 · 前端 查看更多 →
2024年12月25日 Nuxt3使用Naive UI解决刷新页面样式延迟加载问题 最近开始用这个组件库, 在按照官网文档搞完按需自动引入后, 发现首页出现刚进入时会没有样式 像上图这样 错误原因 可能是因为nuxtjs-naive-ui这个库太久没更新来适配Nuxt, 上次更新是7个月前, 我看到有人提交修复, 但是还没有合并到分支 临时解决方法 然后在github找了很久解决办法, 最终找到一个办法 在plugins目录下建naiv... 阅读约需 5 分钟 · 前端 查看更多 →
2024年12月2日 Nuxt3动态设置Favicon 网站小图标 我们知道，Nuxt打包后会有public目录来存放静态文件，可以直接在这里传一个favicon.ico文件，然后访问项目地址/favicon.ico就可以看到这个图标了，但是有时候就是不想传一个固定的，就是想动态的从后台设置网站图标，怎么办 最初的实现 一开始，我是用Nuxt的useHead来把图标插进Html里面 这确实可以实现部分浏览器的图标显示 后来发... 阅读约需 3 分钟 · 前端 查看更多 →
2024年11月25日 Vue3瀑布流组件 最近要做瀑布流，找到了一个比较好用的瀑布流组件 github仓库地址 按照它的文档很快就可以做出来了，使用它的断点配置完美适配不同尺寸 它有这么多配置项 需要注意的是，crossOrigin这个跨域设置，需要设置false才能跨域 这是我做出来的效果 要注意，在Nuxt3中使用需要在Waterfall外面包裹ClientOnly ... 阅读约需 1 分钟 · 前端 查看更多 →
2024年8月18日 Nuxt3 报错500：[nuxt] A composable that requires access to the Nuxt instance……解决方法 不知道大家在平时写Nuxt的过程中有没有遇到过这种报错: 500 [nuxt] A composable that requires access to the Nuxt instance was called outside of a plugin, Nuxt hook, Nuxt middleware, or Vue setup function. This is probably n... 阅读约需 4 分钟 · 前端 查看更多 →
