把写死的接口地址直接放进前端代码，往往会在联调、预发和生产切换时引发一连串请求异常。Nuxt 3 提供了运行时配置与构建时环境变量两套机制，理解它们的加载顺序和作用域，才能稳定地隔离多环境地址。本文说明如何利用 runtimeConfig 配合 .env 文件实现动态 API URL，并对比在...

栏目：JavaScript 时间：08-17 Nuxt3 API_URL environment_config

动态组件在 Nuxt 3 项目里常因异步数据未就绪就渲染而闪白或错位。nextTick 作为 Vue 的异步 DOM 刷新机制，能延迟回调到下次 DOM 更新循环之后。本文说明其原理：当响应式数据变化后，视图不会同步重绘，而是进入队列，nextTick 回调在刷新完成后触发。结合动态组件的懒加载与 Su...

栏目：JavaScript 时间：08-13 Nuxt3 动态组件 nextTick

把 API 地址写死在前端代码里，往往会在切换测试、预发和生产环境时引发接口调用错误。Nuxt 3 提供的 runtimeConfig 机制允许把环境相关的配置从构建阶段剥离，改由运行时读取。通过在项目根目录定义 .env 文件，并在 nuxt.config.ts 中声明 public 与 server 两类配置，前端可...

栏目：JavaScript 时间：08-08 Nuxt3 environment_variable runtime_config

在Nuxt 3项目里，服务端渲染阶段通过useFetch拿到的接口数据常带有用户登录态Cookie，但切换到客户端路由跳转时，请求却莫名丢了鉴权信息。这通常是因为Cookie没有随请求头自动携带，或跨域配置拦截了凭证。直接给useFetch写死headers并不稳妥，服务端和客户端环境对cookie的读取...

栏目：JavaScript 时间：08-07 Nuxt3 useFetch Cookie_header

在使用Nuxt3开发项目时，很多开发者会遇到useFetch拿不到数据或者数据刷新异常的问题。这通常和服务器端渲染时机、响应式参数使用方式以及默认缓存行为有关。比如直接把普通变量传给useFetch的参数，会导致请求没有正确触发。还有在客户端导航时，由于key设置不当，可能出现旧数...

栏目：JavaScript 时间：07-27 Nuxt3 useFetch 数据获取

在Nuxt3项目开发中，导航链接的选中状态是提升用户交互体验的重要功能，很多开发者不清楚具体的实现方式。本文会介绍Nuxt3中导航链接选中状态的核心实现思路，包括内置组件的使用方法、自定义选中样式、动态路由场景下的适配方案，同时提供完整的代码示例帮助理解。无论是基础静...

栏目：HTML/CSS 时间：06-23 Nuxt3 导航链接 选中状态 vue_router active_class