[{"data":1,"prerenderedAt":3117},["ShallowReactive",2],{"docs-all-flat":3,"docs-\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-nuxt-app":1018},[4,8,12,16,20,24,28,32,36,40,44,48,52,56,60,64,68,72,76,80,84,88,92,96,100,104,108,112,116,120,124,128,132,136,140,144,148,152,156,160,164,168,172,176,180,184,188,192,196,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284,288,292,296,300,304,308,312,316,320,324,328,332,336,340,344,348,352,355,359,363,367,371,375,379,383,387,391,395,399,403,407,411,415,419,423,427,431,435,439,443,447,451,455,459,463,467,471,475,479,483,487,491,495,499,503,507,511,515,519,523,527,531,535,539,543,547,551,555,559,563,567,571,575,579,583,587,591,595,599,603,607,611,615,619,623,627,631,635,639,643,647,651,655,659,663,667,671,675,679,683,687,691,695,699,703,707,711,715,719,723,727,731,735,739,743,747,751,755,759,763,767,770,774,778,782,786,790,794,798,802,806,809,813,817,821,825,829,833,837,841,845,849,852,855,859,863,867,871,874,877,881,884,888,892,895,898,901,904,907,911,915,918,922,926,930,934,938,942,946,950,954,958,962,966,970,974,978,982,986,990,994,998,1002,1006,1010,1014],{"path":5,"title":6,"description":7},"\u002Fdocs\u002Fgetting-started\u002Fintroduction","介绍","Nuxt 的目标是提供直观且高性能的 Web 开发体验，并始终将优秀的开发者体验（Developer Experience）放在心上。",{"path":9,"title":10,"description":11},"\u002Fdocs\u002Fgetting-started\u002Finstallation","安装","通过在线 starter 快速上手 Nuxt，或在本地使用终端从零开始。",{"path":13,"title":14,"description":15},"\u002Fdocs\u002Fgetting-started\u002Fconfiguration","配置","Nuxt 提供了合理的默认配置，让你高效开发。",{"path":17,"title":18,"description":19},"\u002Fdocs\u002Fgetting-started\u002Fviews","视图","Nuxt 提供了多个组件层来实现应用的用户界面。",{"path":21,"title":22,"description":23},"\u002Fdocs\u002Fgetting-started\u002Fassets","资源","Nuxt 为你的资源提供了两种处理方式。",{"path":25,"title":26,"description":27},"\u002Fdocs\u002Fgetting-started\u002Fstyling","样式","了解如何为你的 Nuxt 应用添加样式。",{"path":29,"title":30,"description":31},"\u002Fdocs\u002Fgetting-started\u002Frouting","路由","Nuxt 的文件系统路由会为 pages\u002F 目录中的每个文件创建一条路由。",{"path":33,"title":34,"description":35},"\u002Fdocs\u002Fgetting-started\u002Fseo-meta","SEO 与 Meta","借助强大的 head 配置、composables 和组件，改善你的 Nuxt 应用的 SEO。",{"path":37,"title":38,"description":39},"\u002Fdocs\u002Fgetting-started\u002Ftransitions","过渡","使用 Vue 或浏览器原生的 View Transitions，在页面和布局之间应用过渡效果。",{"path":41,"title":42,"description":43},"\u002Fdocs\u002Fgetting-started\u002Fdata-fetching","数据获取","Nuxt 提供了用于处理应用内数据获取的 composables。",{"path":45,"title":46,"description":47},"\u002Fdocs\u002Fgetting-started\u002Fstate-management","状态管理","Nuxt 提供了强大的状态管理库和 useState composable，用于创建响应式且对 SSR 友好的共享状态。",{"path":49,"title":50,"description":51},"\u002Fdocs\u002Fgetting-started\u002Ferror-handling","错误处理","了解如何在 Nuxt 中捕获和处理错误。",{"path":53,"title":54,"description":55},"\u002Fdocs\u002Fgetting-started\u002Fserver","Server","利用 Nuxt 的服务端框架构建全栈应用。你可以从数据库或其他服务端获取数据、创建 API，甚至生成像站点地图或 RSS 这样的静态服务端内容——全部来自同一个代码库。",{"path":57,"title":58,"description":59},"\u002Fdocs\u002Fgetting-started\u002Flayers","Layers","Nuxt 提供了一套强大的系统，允许你扩展默认文件、配置以及更多内容。",{"path":61,"title":62,"description":63},"\u002Fdocs\u002Fgetting-started\u002Fprerendering","Prerendering","Nuxt 允许在构建时静态渲染某些页面，以改善特定的性能或 SEO 指标。",{"path":65,"title":66,"description":67},"\u002Fdocs\u002Fgetting-started\u002Fdeployment","Deployment","了解如何将你的 Nuxt 应用部署到任何托管提供商。",{"path":69,"title":70,"description":71},"\u002Fdocs\u002Fgetting-started\u002Ftesting","Testing","如何测试你的 Nuxt 应用。",{"path":73,"title":74,"description":75},"\u002Fdocs\u002Fgetting-started\u002Fupgrade","Upgrade Guide","了解如何升级到最新的 Nuxt 版本。",{"path":77,"title":78,"description":79},"\u002Fdocs\u002Fdirectory-structure\u002Fnuxt",".nuxt","Nuxt 在开发阶段使用 .nuxt\u002F 目录来生成你的 Vue 应用。",{"path":81,"title":82,"description":83},"\u002Fdocs\u002Fdirectory-structure\u002Foutput",".output","Nuxt 在为生产环境构建应用时创建 .output\u002F 目录。",{"path":85,"title":86,"description":87},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fassets","assets","assets\u002F 目录用于添加所有将由构建工具处理的网站资源。",{"path":89,"title":90,"description":91},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fcomponents","components","components\u002F 目录用于存放你所有的 Vue 组件。",{"path":93,"title":94,"description":95},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fcomposables","composables","使用 composables\u002F 目录将你的 Vue 组合式函数自动导入到应用中。",{"path":97,"title":98,"description":99},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Flayouts","layouts","Nuxt 提供了一个布局框架，用于将通用的 UI 模式提取为可复用的布局。",{"path":101,"title":102,"description":103},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fmiddleware","middleware","Nuxt 提供中间件，用于在导航到特定路由前运行代码。",{"path":105,"title":106,"description":107},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fpages","pages","Nuxt 提供基于文件的路由，用于在 Web 应用中创建路由。",{"path":109,"title":110,"description":111},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fplugins","plugins","Nuxt 拥有一个插件系统，用于在创建 Vue 应用时使用 Vue 插件等。",{"path":113,"title":114,"description":115},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Futils","utils","使用 utils\u002F 目录在你的应用中自动导入工具函数。",{"path":117,"title":118,"description":119},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fapp","app.vue","app.vue 文件是你 Nuxt 应用的主组件。",{"path":121,"title":122,"description":123},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fapp-config","app.config.ts","使用 App Config 文件在应用内部暴露响应式配置。",{"path":125,"title":126,"description":127},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Ferror","error.vue","error.vue 文件是你 Nuxt 应用中的错误页面。",{"path":129,"title":130,"description":131},"\u002Fdocs\u002Fdirectory-structure\u002Fcontent","content","使用 content\u002F 目录为你的应用创建一个基于文件的 CMS。",{"path":133,"title":134,"description":135},"\u002Fdocs\u002Fdirectory-structure\u002Flayers","layers","使用 layers\u002F 目录在你的应用中组织和自动注册本地 layers。",{"path":137,"title":138,"description":139},"\u002Fdocs\u002Fdirectory-structure\u002Fmodules","modules","使用 modules\u002F 目录在你的应用中自动注册本地模块。",{"path":141,"title":142,"description":143},"\u002Fdocs\u002Fdirectory-structure\u002Fnode_modules","node_modules","包管理器将项目的依赖存储在 node_modules\u002F 目录中。",{"path":145,"title":146,"description":147},"\u002Fdocs\u002Fdirectory-structure\u002Fpublic","public","public\u002F 目录用于提供网站的静态资源。",{"path":149,"title":150,"description":151},"\u002Fdocs\u002Fdirectory-structure\u002Fserver","server","server\u002F 目录用于为你的应用注册 API 和服务端处理器。",{"path":153,"title":154,"description":155},"\u002Fdocs\u002Fdirectory-structure\u002Fshared","shared","使用 shared\u002F 目录在 Vue 应用和 Nitro 服务端之间共享功能。",{"path":157,"title":158,"description":159},"\u002Fdocs\u002Fdirectory-structure\u002Fenv",".env",".env 文件用于指定构建\u002F开发时的环境变量。",{"path":161,"title":162,"description":163},"\u002Fdocs\u002Fdirectory-structure\u002Fgitignore",".gitignore",".gitignore 文件用于指定 git 应当忽略的、有意不跟踪的文件。",{"path":165,"title":166,"description":167},"\u002Fdocs\u002Fdirectory-structure\u002Fnuxtignore",".nuxtignore",".nuxtignore 文件用于让 Nuxt 在构建阶段忽略项目根目录中的文件。",{"path":169,"title":170,"description":171},"\u002Fdocs\u002Fdirectory-structure\u002Fnuxtrc",".nuxtrc",".nuxtrc 文件允许你用扁平语法定义 Nuxt 配置。",{"path":173,"title":174,"description":175},"\u002Fdocs\u002Fdirectory-structure\u002Fnuxt-config","nuxt.config.ts","只需要一个 nuxt.config 文件，即可轻松配置 Nuxt。",{"path":177,"title":178,"description":179},"\u002Fdocs\u002Fdirectory-structure\u002Fpackage","package.json","package.json 文件包含你应用的所有依赖和脚本。",{"path":181,"title":182,"description":183},"\u002Fdocs\u002Fdirectory-structure\u002Ftsconfig","tsconfig.json","了解 Nuxt 如何在项目的不同部分管理 TypeScript 配置。",{"path":185,"title":186,"description":187},"\u002Fdocs\u002Fdirectory-structure","Nuxt 目录结构","了解 Nuxt 应用的目录结构以及如何使用它。",{"path":189,"title":190,"description":191},"\u002Fdocs\u002Fguide","Nuxt 指南","通过深入的指南了解 Nuxt 的工作原理。",{"path":193,"title":194,"description":195},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Frendering","渲染模式","了解 Nuxt 中可用的不同渲染模式。",{"path":197,"title":198,"description":199},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fvuejs-development","Vue.js 开发","Nuxt 使用 Vue.js，并添加了组件自动导入、基于文件的路由以及支持 SSR 的组合式函数等特性。",{"path":201,"title":202,"description":203},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fnuxt-lifecycle","Nuxt 生命周期","理解 Nuxt 应用的生命周期，可以帮助你更深入地了解框架是如何运作的，尤其是在服务端渲染和客户端渲染两方面。",{"path":205,"title":206,"description":207},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fauto-imports","自动导入","Nuxt 会自动导入组件、组合式函数、辅助函数和 Vue API。",{"path":209,"title":210,"description":211},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fserver-engine","服务端引擎","Nuxt 由一个全新的服务端引擎驱动：Nitro。",{"path":213,"title":214,"description":215},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fmodules","模块","Nuxt 提供了一个模块系统来扩展框架核心并简化集成。",{"path":217,"title":218,"description":219},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fesm","ES 模块","Nuxt 使用原生的 ES 模块。",{"path":221,"title":222,"description":223},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Ftypescript","TypeScript","Nuxt 完全类型化，并提供了有用的快捷方式，确保你在编码时能获取准确的类型信息。",{"path":225,"title":226,"description":227},"\u002Fdocs\u002Fguide\u002Fconcepts\u002Fcode-style","代码风格","Nuxt 开箱即用地支持 ESLint",{"path":229,"title":230,"description":231},"\u002Fdocs\u002Fguide\u002Fbest-practices\u002Fdevcontainers","Dev Containers","在开发容器中设置或打开 Nuxt 项目，以获得一致开发环境。",{"path":233,"title":234,"description":235},"\u002Fdocs\u002Fguide\u002Fbest-practices\u002Fhydration","Nuxt and Hydration","为什么修复水合问题很重要",{"path":237,"title":238,"description":239},"\u002Fdocs\u002Fguide\u002Fbest-practices\u002Fperformance","Nuxt performance","提升 Nuxt 应用性能的最佳实践。",{"path":241,"title":242,"description":243},"\u002Fdocs\u002Fguide\u002Fbest-practices\u002Fplugins","Nuxt Plugins","使用 Nuxt 插件时的最佳实践。",{"path":245,"title":246,"description":247},"\u002Fdocs\u002Fguide\u002Fai\u002Fmcp","Nuxt MCP Server","借助 Model Context Protocol 支持，在你的 AI 助手中使用 Nuxt 文档。",{"path":249,"title":250,"description":251},"\u002Fdocs\u002Fguide\u002Fai\u002Fllms-txt","Nuxt LLMs.txt","如何让 Cursor、Windsurf、GitHub Copilot、ChatGPT 和 Claude 等 AI 工具理解 Nuxt 的概念、API 和最佳实践。",{"path":253,"title":254,"description":255},"\u002Fdocs\u002Fguide\u002Fmodules\u002Fgetting-started","创建你的第一个模块","学习如何使用官方启动模板创建你的第一个 Nuxt 模块。",{"path":257,"title":258,"description":259},"\u002Fdocs\u002Fguide\u002Fmodules\u002Fmodule-anatomy","理解模块结构","学习 Nuxt 模块是如何构成的，以及如何定义它们。",{"path":261,"title":262,"description":263},"\u002Fdocs\u002Fguide\u002Fmodules\u002Frecipes-basics","添加插件、组件等","学习如何从你的模块注入插件、组件、组合式函数和服务端路由。",{"path":265,"title":266,"description":267},"\u002Fdocs\u002Fguide\u002Fmodules\u002Fmodule-dependencies","模块依赖","声明对其它模块的依赖，并带有版本约束和配置合并。",{"path":269,"title":270,"description":271},"\u002Fdocs\u002Fguide\u002Fmodules\u002Frecipes-advanced","使用钩子与扩展类型","在你的模块中掌握生命周期钩子、虚拟文件和 TypeScript 声明。",{"path":273,"title":274,"description":275},"\u002Fdocs\u002Fguide\u002Fmodules\u002Ftesting","测试你的模块","学习如何对你的 Nuxt 模块进行单元、集成和 E2E 测试。",{"path":277,"title":278,"description":279},"\u002Fdocs\u002Fguide\u002Fmodules\u002Fbest-practices","遵循最佳实践","使用这些指南构建高性能且可维护的 Nuxt 模块。",{"path":281,"title":282,"description":283},"\u002Fdocs\u002Fguide\u002Fmodules\u002Fecosystem","发布与分享你的模块","加入 Nuxt 模块生态，并将你的模块发布到 npm。",{"path":285,"title":286,"description":287},"\u002Fdocs\u002Fguide\u002Fmodules","Module Author Guide","学习如何创建 Nuxt 模块，以集成、增强或扩展任意 Nuxt 应用。",{"path":289,"title":290,"description":291},"\u002Fdocs\u002Fguide\u002Frecipes\u002Fcustom-routing","自定义路由","在 Nuxt 中，你的路由由 pages 目录内文件的结构定义。不过，由于底层使用了 vue-router，Nuxt 提供了几种在你的项目中添加自定义路由的方式。",{"path":293,"title":294,"description":295},"\u002Fdocs\u002Fguide\u002Frecipes\u002Fvite-plugin","在 Nuxt 中使用 Vite 插件","学习如何将 Vite 插件集成到你的 Nuxt 项目中。",{"path":297,"title":298,"description":299},"\u002Fdocs\u002Fguide\u002Frecipes\u002Fcustom-usefetch","Nuxt 中的自定义 useFetch","如何在 Nuxt 中创建用于调用你外部 API 的自定义 fetcher。",{"path":301,"title":302,"description":303},"\u002Fdocs\u002Fguide\u002Frecipes\u002Fsessions-and-authentication","会话与鉴权","鉴权是 Web 应用中极其常见的需求。本配方将向你展示如何在你的 Nuxt 应用中实现基本的用户注册与鉴权。",{"path":305,"title":306,"description":307},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fevents","创建自定义事件","Nuxt 提供了一个由 hookable 驱动的强大事件系统。",{"path":309,"title":310,"description":311},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fexperimental-features","实验性特性","启用 Nuxt 实验性特性以解锁新的可能性。",{"path":313,"title":314,"description":315},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Ffeatures","特性开关","启用或禁用可选的 Nuxt 特性，以解锁新的可能性。",{"path":317,"title":318,"description":319},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Finternals","Nuxt 是如何工作的？","Nuxt 是一个极简但高度可定制的框架，用于构建 Web 应用。",{"path":321,"title":322,"description":323},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fruntime-config","运行时配置","Nuxt 提供了一套运行时配置 API，以在你的应用内暴露配置和密钥。",{"path":325,"title":326,"description":327},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fnightly-release-channel","Nightly 发布通道","nightly 发布通道允许使用直接从仓库最新提交构建的 Nuxt。",{"path":329,"title":330,"description":331},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fhooks","生命周期钩子","Nuxt 提供了一个强大的钩子系统，可使用钩子扩展几乎每个方面。",{"path":333,"title":334,"description":335},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fkit","Nuxt Kit","@nuxt\u002Fkit 提供了面向模块作者的功能。",{"path":337,"title":338,"description":339},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fnuxt-app","NuxtApp","在 Nuxt 中，你可以在组合式函数、组件和插件中访问运行时应用上下文。",{"path":341,"title":342,"description":343},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Flayers","编写 Nuxt Layers","Nuxt 提供了一个强大的系统，允许你扩展默认文件、配置等等。",{"path":345,"title":346,"description":347},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fbuilders","创建 Builder","了解 Nuxt builder 是如何工作的，以及如何编写你自己的 builder。",{"path":349,"title":350,"description":351},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fdebugging","调试","在 Nuxt 中，你可以直接在浏览器中以及你的 IDE 里开始调试你的应用。",{"path":353,"title":354,"description":354},"\u002Fdocs\u002Fguide\u002Fgoing-further","",{"path":356,"title":357,"description":358},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fclient-only","\u003CClientOnly>","使用 \u003CClientOnly> 组件仅在客户端渲染组件。",{"path":360,"title":361,"description":362},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fdev-only","\u003CDevOnly>","使用 \u003CDevOnly> 组件仅在开发期间渲染组件。",{"path":364,"title":365,"description":366},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-client-fallback","\u003CNuxtClientFallback>","Nuxt 提供了 \u003CNuxtClientFallback> 组件，当其任意子组件在 SSR 中触发错误时，在客户端渲染其内容",{"path":368,"title":369,"description":370},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-picture","\u003CNuxtPicture>","Nuxt 提供了 \u003CNuxtPicture> 组件来处理自动图像优化。",{"path":372,"title":373,"description":374},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fteleports","\u003CTeleport>","\u003CTeleport> 组件将组件传送到 DOM 中的另一个位置。",{"path":376,"title":377,"description":378},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-route-announcer","\u003CNuxtRouteAnnouncer>","\u003CNuxtRouteAnnouncer> 组件添加一个带有页面标题的隐藏元素，用于向辅助技术播报路由变化。",{"path":380,"title":381,"description":382},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-time","\u003CNuxtTime>","\u003CNuxtTime> 组件以本地化友好的格式显示时间，并保持服务端-客户端一致。",{"path":384,"title":385,"description":386},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-announcer","\u003CNuxtAnnouncer>","\u003CNuxtAnnouncer> 组件添加一个隐藏元素，用于向辅助技术播报动态内容变化。",{"path":388,"title":389,"description":390},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-page","\u003CNuxtPage>","\u003CNuxtPage> 组件用于显示位于 pages\u002F 目录中的页面。",{"path":392,"title":393,"description":394},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-layout","\u003CNuxtLayout>","Nuxt 提供了 \u003CNuxtLayout> 组件，用于在页面和错误页面上显示布局。",{"path":396,"title":397,"description":398},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-link","\u003CNuxtLink>","Nuxt 提供了 \u003CNuxtLink> 组件来处理应用内的各类链接。",{"path":400,"title":401,"description":402},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-loading-indicator","\u003CNuxtLoadingIndicator>","在页面导航之间显示进度条。",{"path":404,"title":405,"description":406},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-error-boundary","\u003CNuxtErrorBoundary>","\u003CNuxtErrorBoundary> 组件处理其默认插槽中发生的客户端错误。",{"path":408,"title":409,"description":410},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-welcome","\u003CNuxtWelcome>","\u003CNuxtWelcome> 组件用于欢迎通过启动模板创建的新项目的用户。",{"path":412,"title":413,"description":414},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-island","\u003CNuxtIsland>","Nuxt 提供了 \u003CNuxtIsland> 组件，用于渲染无客户端 JS 的非交互式组件。",{"path":416,"title":417,"description":418},"\u002Fdocs\u002Fapi\u002Fcomponents\u002Fnuxt-img","\u003CNuxtImg>","Nuxt 提供了 \u003CNuxtImg> 组件来处理自动图像优化。",{"path":420,"title":421,"description":422},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fcreate-use-async-data","createUseAsyncData","一个工厂函数，用于创建带有预定义默认选项的自定义 useAsyncData 组合式函数。",{"path":424,"title":425,"description":426},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fcreate-use-fetch","createUseFetch","一个工厂函数，用于创建带有预定义默认选项的自定义 useFetch 组合式函数。",{"path":428,"title":429,"description":430},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fon-prehydrate","onPrehydrate","使用 onPrehydrate 在 Nuxt 对页面进行 hydration 之前的客户端立即运行回调。",{"path":432,"title":433,"description":434},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-announcer","useAnnouncer","一个用于向屏幕阅读器播报消息的组合式函数。",{"path":436,"title":437,"description":438},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-app-config","useAppConfig","访问在项目中定义的可响应 app config。",{"path":440,"title":441,"description":442},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-async-data","useAsyncData","useAsyncData 以 SSR 友好的方式提供对异步解析数据的访问。",{"path":444,"title":445,"description":446},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-cookie","useCookie","useCookie 是一个 SSR 友好的组合式函数，用于读写 cookie。",{"path":448,"title":449,"description":450},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-error","useError","useError 组合式函数返回正在被处理的全局 Nuxt 错误。",{"path":452,"title":453,"description":454},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-fetch","useFetch","使用 SSR 友好的组合式函数从 API 端点获取数据。",{"path":456,"title":457,"description":458},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-head","useHead","useHead 用于自定义 Nuxt 应用各个页面的 head 属性。",{"path":460,"title":461,"description":462},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-head-safe","useHeadSafe","处理用户输入时提供 head 数据的推荐方式。",{"path":464,"title":465,"description":466},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-hydration","useHydration","允许完全控制 hydration 周期，以便从服务端设置和接收数据。",{"path":468,"title":469,"description":470},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-layout","useLayout","useLayout 返回为当前路由解析出的布局。",{"path":472,"title":473,"description":474},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-lazy-async-data","useLazyAsyncData","该组合式函数包装 useAsyncData，会在 handler 解析之前立即触发导航。",{"path":476,"title":477,"description":478},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-lazy-fetch","useLazyFetch","该组合式函数是对 useFetch 的封装，会在 handler 解析之前立即触发导航。",{"path":480,"title":481,"description":482},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-loading-indicator","useLoadingIndicator","该组合式函数让你访问应用页面的加载状态。",{"path":484,"title":485,"description":486},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-nuxt-app","useNuxtApp","访问 Nuxt 应用的共享运行时上下文。",{"path":488,"title":489,"description":490},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-nuxt-data","useNuxtData","访问数据获取组合式函数的当前缓存值。",{"path":492,"title":493,"description":494},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-preview-mode","usePreviewMode","使用 usePreviewMode 检查并控制 Nuxt 的预览模式",{"path":496,"title":497,"description":498},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-request-event","useRequestEvent","使用 useRequestEvent 组合式函数访问传入的请求事件。",{"path":500,"title":501,"description":502},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-request-fetch","useRequestFetch","使用 useRequestFetch 组合式函数为服务端 fetch 请求转发请求上下文和请求头。",{"path":504,"title":505,"description":506},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-request-header","useRequestHeader","使用 useRequestHeader 访问某个特定的传入请求头。",{"path":508,"title":509,"description":510},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-request-headers","useRequestHeaders","使用 useRequestHeaders 访问传入的请求头。",{"path":512,"title":513,"description":514},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-request-url","useRequestURL","使用 useRequestURL 组合式函数访问传入的请求 URL。",{"path":516,"title":517,"description":518},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-response-header","useResponseHeader","使用 useResponseHeader 设置服务端响应头。",{"path":520,"title":521,"description":522},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-route","useRoute","useRoute 组合式函数返回当前路由。",{"path":524,"title":525,"description":526},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-route-announcer","useRouteAnnouncer","该组合式函数监视页面标题变化，并相应地更新播报消息。",{"path":528,"title":529,"description":530},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-router","useRouter","useRouter 组合式函数返回 router 实例。",{"path":532,"title":533,"description":534},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-runtime-config","useRuntimeConfig","使用 useRuntimeConfig 组合式函数访问运行时配置变量。",{"path":536,"title":537,"description":538},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-runtime-hook","useRuntimeHook","在 Nuxt 应用中注册一个运行时钩子，并确保在作用域销毁时被正确清理。",{"path":540,"title":541,"description":542},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-seo-meta","useSeoMeta","useSeoMeta 组合式函数让你可以将站点的 SEO meta 标签定义为一个扁平对象，并提供完整的 TypeScript 支持。",{"path":544,"title":545,"description":546},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-server-seo-meta","useServerSeoMeta","useServerSeoMeta 组合式函数让你可以将站点的 SEO meta 标签定义为一个扁平对象，并提供完整的 TypeScript 支持。",{"path":548,"title":549,"description":550},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-state","useState","useState 组合式函数创建一个可响应的、SSR 友好的共享状态。",{"path":552,"title":553,"description":554},"\u002Fdocs\u002Fapi\u002Futils\u002Fdollarfetch","$fetch","Nuxt 使用 ofetch 全局暴露了 $fetch 辅助函数，用于发起 HTTP 请求。",{"path":556,"title":557,"description":558},"\u002Fdocs\u002Fapi\u002Futils\u002Fabort-navigation","abortNavigation","abortNavigation 是一个辅助函数，用于阻止导航的发生，并在设置了参数时抛出错误。",{"path":560,"title":561,"description":562},"\u002Fdocs\u002Fapi\u002Futils\u002Fadd-route-middleware","addRouteMiddleware","addRouteMiddleware() 是一个在你的应用中动态添加中间件的辅助函数。",{"path":564,"title":565,"description":566},"\u002Fdocs\u002Fapi\u002Futils\u002Fcall-once","callOnce","在 SSR 或 CSR 期间只运行一次给定的函数或代码块。",{"path":568,"title":569,"description":570},"\u002Fdocs\u002Fapi\u002Futils\u002Fclear-error","clearError","clearError 组合式函数清除所有已处理的错误。",{"path":572,"title":573,"description":574},"\u002Fdocs\u002Fapi\u002Futils\u002Fclear-nuxt-data","clearNuxtData","删除 useAsyncData 和 useFetch 的缓存数据、错误状态和挂起的 promise。",{"path":576,"title":577,"description":578},"\u002Fdocs\u002Fapi\u002Futils\u002Fclear-nuxt-state","clearNuxtState","删除 useState 的缓存状态。",{"path":580,"title":581,"description":582},"\u002Fdocs\u002Fapi\u002Futils\u002Fcreate-error","createError","创建一个带有附加元数据的错误对象。",{"path":584,"title":585,"description":586},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-lazy-hydration-component","defineLazyHydrationComponent","使用特定策略定义一个懒加载 hydration 组件。",{"path":588,"title":589,"description":590},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-nuxt-component","defineNuxtComponent","defineNuxtComponent() 是一个用于使用 Options API 定义类型安全组件的辅助函数。",{"path":592,"title":593,"description":594},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-nuxt-plugin","defineNuxtPlugin","defineNuxtPlugin() 是一个用于创建 Nuxt 插件的辅助函数。",{"path":596,"title":597,"description":598},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-nuxt-route-middleware","defineNuxtRouteMiddleware","使用 defineNuxtRouteMiddleware 辅助函数创建命名路由中间件。",{"path":600,"title":601,"description":602},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-page-meta","definePageMeta","为你的页面组件定义元数据。",{"path":604,"title":605,"description":606},"\u002Fdocs\u002Fapi\u002Futils\u002Fdefine-route-rules","defineRouteRules","在页面层面定义用于混合渲染的路由规则。",{"path":608,"title":609,"description":610},"\u002Fdocs\u002Fapi\u002Futils\u002Fnavigate-to","navigateTo","navigateTo 是一个用于以编程方式导航用户的辅助函数。",{"path":612,"title":613,"description":614},"\u002Fdocs\u002Fapi\u002Futils\u002Fon-before-route-leave","onBeforeRouteLeave","onBeforeRouteLeave 组合式函数允许在组件内部注册一个路由守卫。",{"path":616,"title":617,"description":618},"\u002Fdocs\u002Fapi\u002Futils\u002Fon-before-route-update","onBeforeRouteUpdate","onBeforeRouteUpdate 组合式函数允许在组件内部注册一个路由守卫。",{"path":620,"title":621,"description":622},"\u002Fdocs\u002Fapi\u002Futils\u002Fon-nuxt-ready","onNuxtReady","onNuxtReady 组合式函数允许在你的应用完成初始化之后运行一个回调。",{"path":624,"title":625,"description":626},"\u002Fdocs\u002Fapi\u002Futils\u002Fprefetch-components","prefetchComponents","Nuxt 提供了用于在预取组件方面给予你控制的工具。",{"path":628,"title":629,"description":630},"\u002Fdocs\u002Fapi\u002Futils\u002Fpreload-components","preloadComponents","Nuxt 提供了用于在预加载组件方面给予你控制的工具。",{"path":632,"title":633,"description":634},"\u002Fdocs\u002Fapi\u002Futils\u002Fpreload-route-components","preloadRouteComponents","preloadRouteComponents 允许你手动预加载 Nuxt 应用中的单个页面。",{"path":636,"title":637,"description":638},"\u002Fdocs\u002Fapi\u002Futils\u002Fprerender-routes","prerenderRoutes","prerenderRoutes 向 Nitro 暗示预渲染一个额外的路由。",{"path":640,"title":641,"description":642},"\u002Fdocs\u002Fapi\u002Futils\u002Frefresh-cookie","refreshCookie","当 cookie 发生变化时，手动刷新 useCookie 的值",{"path":644,"title":645,"description":646},"\u002Fdocs\u002Fapi\u002Futils\u002Frefresh-nuxt-data","refreshNuxtData","刷新 Nuxt 中所有或特定的 asyncData 实例",{"path":648,"title":649,"description":650},"\u002Fdocs\u002Fapi\u002Futils\u002Freload-nuxt-app","reloadNuxtApp","reloadNuxtApp 会对页面执行一次硬刷新。",{"path":652,"title":653,"description":654},"\u002Fdocs\u002Fapi\u002Futils\u002Fset-page-layout","setPageLayout","setPageLayout 允许你动态更改页面的布局。",{"path":656,"title":657,"description":658},"\u002Fdocs\u002Fapi\u002Futils\u002Fset-response-status","setResponseStatus","setResponseStatus 设置响应的状态码（以及可选的 statusText）。",{"path":660,"title":661,"description":662},"\u002Fdocs\u002Fapi\u002Futils\u002Fshow-error","showError","Nuxt 提供了一种快速且简单的方式，在需要的时候显示全屏错误页。",{"path":664,"title":665,"description":666},"\u002Fdocs\u002Fapi\u002Futils\u002Fupdate-app-config","updateAppConfig","在运行时更新 App Config。",{"path":668,"title":669,"description":670},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fadd","nuxt add","在你的 Nuxt 应用中快速搭建一个实体（文件）。",{"path":672,"title":673,"description":674},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fanalyze","nuxt analyze","分析生产环境的打包产物或你的 Nuxt 应用。",{"path":676,"title":677,"description":678},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fbuild","nuxt build","构建你的 Nuxt 应用。",{"path":680,"title":681,"description":682},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fbuild-module","nuxt build-module","用于在发布前构建你的 Nuxt 模块的 Nuxt 命令。",{"path":684,"title":685,"description":686},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fcleanup","nuxt cleanup","移除常见的 Nuxt 生成文件和缓存。",{"path":688,"title":689,"description":690},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fdev","nuxt dev","dev 命令会在 http:\u002F\u002Flocalhost:3000 启动一个带有热模块替换（HMR）的开发服务器。",{"path":692,"title":693,"description":694},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fdevtools","nuxt devtools","devtools 命令允许你基于每个项目启用或禁用 Nuxt DevTools。",{"path":696,"title":697,"description":698},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fgenerate","nuxt generate","预渲染应用的每一个路由，并将结果存储为纯 HTML 文件。",{"path":700,"title":701,"description":702},"\u002Fdocs\u002Fapi\u002Fcommands\u002Finfo","nuxt info","info 命令会记录当前或指定 Nuxt 项目的相关信息。",{"path":704,"title":705,"description":706},"\u002Fdocs\u002Fapi\u002Fcommands\u002Finit","create nuxt","init 命令用于初始化一个全新的 Nuxt 项目。",{"path":708,"title":709,"description":710},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fmodule","nuxt module","通过命令行搜索并向你的 Nuxt 应用添加模块。",{"path":712,"title":713,"description":714},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fprepare","nuxt prepare","prepare 命令会在你的应用中创建一个 .nuxt 目录并生成类型。",{"path":716,"title":717,"description":718},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fpreview","nuxt preview","preview 命令会启动一个服务器，用于在运行 build 命令后预览你的应用。",{"path":720,"title":721,"description":722},"\u002Fdocs\u002Fapi\u002Fcommands\u002Ftest","nuxt test","test 命令使用 @nuxt\u002Ftest-utils 运行测试。",{"path":724,"title":725,"description":726},"\u002Fdocs\u002Fapi\u002Fcommands\u002Ftypecheck","nuxt typecheck","typecheck 命令运行 vue-tsc 来全量检查你的应用类型。",{"path":728,"title":729,"description":730},"\u002Fdocs\u002Fapi\u002Fcommands\u002Fupgrade","nuxt upgrade","upgrade 命令将 Nuxt 升级到最新版本。",{"path":732,"title":733,"description":734},"\u002Fdocs\u002Fapi\u002Fkit\u002Fmodules","Modules","Nuxt Kit 提供了一系列工具，帮助你创建和使用模块。你可以使用这些工具来创建自己的模块，或复用已有的模块。",{"path":736,"title":737,"description":738},"\u002Fdocs\u002Fapi\u002Fkit\u002Fruntime-config","Runtime Config","Nuxt Kit 提供了一系列工具，帮助你访问和修改 Nuxt 运行时配置。",{"path":740,"title":741,"description":742},"\u002Fdocs\u002Fapi\u002Fkit\u002Ftemplates","Templates","Nuxt Kit 提供了一系列工具，帮助你处理模板。这些函数允许你在开发和构建期间生成额外的文件。",{"path":744,"title":745,"description":746},"\u002Fdocs\u002Fapi\u002Fkit\u002Fapp-config","App Config","Nuxt Kit 提供了一系列工具，帮助你访问和修改 Nuxt 应用配置。",{"path":748,"title":749,"description":750},"\u002Fdocs\u002Fapi\u002Fkit\u002Fnitro","Nitro","Nuxt Kit 提供了一系列工具，帮助你使用 Nitro。这些函数允许你添加服务器处理器、插件和预渲染路由。",{"path":752,"title":753,"description":754},"\u002Fdocs\u002Fapi\u002Fkit\u002Fresolving","Resolving","Nuxt Kit 提供了从 Nuxt 根目录或自定义基准路径解析路径的实用工具。",{"path":756,"title":757,"description":758},"\u002Fdocs\u002Fapi\u002Fkit\u002Flogging","Logging","Nuxt Kit 提供了一系列工具，帮助你使用日志记录。这些函数允许你以额外功能记录消息。",{"path":760,"title":761,"description":762},"\u002Fdocs\u002Fapi\u002Fkit\u002Fbuilder","Builder","Nuxt Kit 提供了一系列工具，帮助你使用构建器。这些函数允许你扩展 Vite 和 webpack 配置。",{"path":764,"title":765,"description":766},"\u002Fdocs\u002Fapi\u002Fkit\u002Fexamples","Examples","Nuxt Kit 工具的使用示例。",{"path":768,"title":58,"description":769},"\u002Fdocs\u002Fapi\u002Fkit\u002Flayers","Nuxt Kit 提供了帮助你处理层及其目录结构的工具。",{"path":771,"title":772,"description":773},"\u002Fdocs\u002Fapi\u002Fkit\u002Fprogrammatic","Programmatic Usage","Nuxt Kit 提供了一系列工具，帮助你以编程方式使用 Nuxt。这些函数允许你加载 Nuxt、构建 Nuxt，以及加载 Nuxt 配置。",{"path":775,"title":776,"description":777},"\u002Fdocs\u002Fapi\u002Fkit\u002Fcompatibility","Compatibility","Nuxt Kit 提供了一系列工具，帮助你检查模块与不同 Nuxt 版本的兼容性。",{"path":779,"title":780,"description":781},"\u002Fdocs\u002Fapi\u002Fkit\u002Fautoimports","Auto-imports","Nuxt Kit 提供了一系列工具，帮助你处理自动导入。这些函数允许你注册自己的 utils、composables 和 Vue API。",{"path":783,"title":784,"description":785},"\u002Fdocs\u002Fapi\u002Fkit\u002Fcomponents","Components","Nuxt Kit 提供了一系列工具，帮助你处理组件。你可以全局或局部注册组件，也可以添加要被扫描的目录。",{"path":787,"title":788,"description":789},"\u002Fdocs\u002Fapi\u002Fkit\u002Fcontext","Context","Nuxt Kit 提供了一系列工具，帮助你处理上下文。",{"path":791,"title":792,"description":793},"\u002Fdocs\u002Fapi\u002Fkit\u002Fpages","Pages","Nuxt Kit 提供了一系列工具，帮助你创建和使用页面。你可以使用这些工具来操作页面配置或定义路由规则。",{"path":795,"title":796,"description":797},"\u002Fdocs\u002Fapi\u002Fkit\u002Flayout","Layout","Nuxt Kit 提供了一系列工具，帮助你处理布局。",{"path":799,"title":800,"description":801},"\u002Fdocs\u002Fapi\u002Fkit\u002Fhead","Head","Nuxt Kit 提供了一系列工具，帮助你在模块中管理 head 配置。",{"path":803,"title":804,"description":805},"\u002Fdocs\u002Fapi\u002Fkit\u002Fplugins","Plugins","Nuxt Kit 提供了一系列工具，帮助你创建和使用插件。你可以使用这些函数向你的模块添加插件或插件模板。",{"path":807,"title":330,"description":808},"\u002Fdocs\u002Fapi\u002Fadvanced\u002Fhooks","Nuxt 提供了一套强大的钩子系统，可以通过钩子扩展几乎各个方面。",{"path":810,"title":811,"description":812},"\u002Fdocs\u002Fapi\u002Fadvanced\u002Fimport-meta","Import meta","使用 `import.meta` 了解你的代码运行在何处。",{"path":814,"title":815,"description":816},"\u002Fdocs\u002Fapi\u002Fnuxt-config","Nuxt 配置","发现你可以在 nuxt.config.ts 文件中使用的所有选项。",{"path":818,"title":819,"description":820},"\u002Fdocs\u002Fapi","Nuxt API 参考","探索所有 Nuxt 内部机制：组件、组合式函数、工具函数、命令等等。",{"path":822,"title":823,"description":824},"\u002Fdocs\u002Fcommunity\u002Fgetting-help","获取帮助","我们是一个友好的开发者社区，很乐意提供帮助。",{"path":826,"title":827,"description":828},"\u002Fdocs\u002Fcommunity\u002Freporting-bugs","报告 Bug","开源中最有价值的角色之一，就是花时间把 bug 报告得清楚明白。",{"path":830,"title":831,"description":832},"\u002Fdocs\u002Fcommunity\u002Fcontribution","贡献","Nuxt 是一个社区项目——因此我们欢迎各种形式的贡献！❤️",{"path":834,"title":835,"description":836},"\u002Fdocs\u002Fcommunity\u002Fframework-contribution","框架贡献","关于向框架仓库贡献的一些具体要点。",{"path":838,"title":839,"description":840},"\u002Fdocs\u002Fcommunity\u002Froadmap","路线图","Nuxt 在不断发展，新功能和模块一直在增加。",{"path":842,"title":843,"description":844},"\u002Fdocs\u002Fcommunity\u002Fchangelog","发布","发现 Nuxt 及 Nuxt 官方模块的最新发布。",{"path":846,"title":847,"description":848},"\u002Fdocs\u002Fbridge\u002Foverview","概述","缩小与 Nuxt 3 的差异，并减轻迁移到 Nuxt 3 的负担。",{"path":850,"title":14,"description":851},"\u002Fdocs\u002Fbridge\u002Fconfiguration","了解如何根据你的需求配置 Nuxt Bridge。",{"path":853,"title":222,"description":854},"\u002Fdocs\u002Fbridge\u002Ftypescript","了解如何在 Nuxt Bridge 中使用 TypeScript。",{"path":856,"title":857,"description":858},"\u002Fdocs\u002Fbridge\u002Fbridge-composition-api","旧版 Composition API","了解如何使用 Nuxt Bridge 迁移到 Composition API。",{"path":860,"title":861,"description":862},"\u002Fdocs\u002Fbridge\u002Fplugins-and-middleware","插件和中间件","了解如何从 Nuxt 2 迁移到 Nuxt Bridge 的新插件和中间件。",{"path":864,"title":865,"description":866},"\u002Fdocs\u002Fbridge\u002Fnuxt3-compatible-api","新的 Composition API","Nuxt Bridge 实现了与 Nuxt 3 兼容的组合式函数。",{"path":868,"title":869,"description":870},"\u002Fdocs\u002Fbridge\u002Fmeta","Meta 标签","了解如何从 Nuxt 2 迁移到 Nuxt Bridge 的新 meta 标签。",{"path":872,"title":322,"description":873},"\u002Fdocs\u002Fbridge\u002Fruntime-config","Nuxt 提供了一个运行时配置 API，用于在应用中暴露配置和密钥。",{"path":875,"title":749,"description":876},"\u002Fdocs\u002Fbridge\u002Fnitro","通过 Nuxt Bridge 为你的 Nuxt 2 应用激活 Nitro。",{"path":878,"title":879,"description":880},"\u002Fdocs\u002Fbridge\u002Fvite","Vite","通过 Nuxt Bridge 为你的 Nuxt 2 应用激活 Vite。",{"path":882,"title":847,"description":883},"\u002Fdocs\u002Fmigration\u002Foverview","Nuxt 3 是对 Nuxt 2 的完整重写，并且基于一套全新的底层技术。",{"path":885,"title":886,"description":887},"\u002Fdocs\u002Fmigration\u002Fbundling","构建工具","了解如何从 Nuxt 2 迁移到 Nuxt 3 的构建工具。",{"path":889,"title":890,"description":891},"\u002Fdocs\u002Fmigration\u002Fserver","服务器","了解如何从 Nuxt 2 迁移到 Nuxt 3 的服务器。",{"path":893,"title":14,"description":894},"\u002Fdocs\u002Fmigration\u002Fconfiguration","了解如何从 Nuxt 2 迁移到 Nuxt 3 的新配置。",{"path":896,"title":214,"description":897},"\u002Fdocs\u002Fmigration\u002Fmodule-authors","了解如何从 Nuxt 2 迁移到 Nuxt 3 模块。",{"path":899,"title":206,"description":900},"\u002Fdocs\u002Fmigration\u002Fauto-imports","Nuxt 3 采用最小摩擦的方式，即在任何可能的地方自动导入组件和组合式函数。",{"path":902,"title":869,"description":903},"\u002Fdocs\u002Fmigration\u002Fmeta","管理你的 meta 标签，从 Nuxt 2 到 Nuxt 3。",{"path":905,"title":861,"description":906},"\u002Fdocs\u002Fmigration\u002Fplugins-and-middleware","了解如何从 Nuxt 2 迁移到 Nuxt 3 的插件和中间件。",{"path":908,"title":909,"description":910},"\u002Fdocs\u002Fmigration\u002Fpages-and-layouts","页面和布局","了解如何从 Nuxt 2 迁移到 Nuxt 3 的页面和布局。",{"path":912,"title":913,"description":914},"\u002Fdocs\u002Fmigration\u002Fcomponent-options","组件选项","了解如何从 Nuxt 2 的组件选项迁移到 Nuxt 3 的组合式函数。",{"path":916,"title":322,"description":917},"\u002Fdocs\u002Fmigration\u002Fruntime-config","了解如何从 Nuxt 2 迁移到 Nuxt 3 的运行时配置。",{"path":919,"title":920,"description":921},"\u002Fdocs\u002Freadme","Nuxt 文档","本仓库包含 Nuxt 的文档，托管于 https:\u002F\u002Fnuxt.com\u002Fdocs\u002Fgetting-started\u002Fintroduction",{"path":923,"title":924,"description":925},"\u002Fdocs\u002Ferrors\u002Fb5001","NUXT_B5001","缺少 compatibilityDate (兼容性日期)",{"path":927,"title":928,"description":929},"\u002Fdocs\u002Ferrors\u002Fb5003","NUXT_B5003","保留的 runtimeConfig.app 命名空间",{"path":931,"title":932,"description":933},"\u002Fdocs\u002Ferrors\u002Fb5004","NUXT_B5004","不支持外部配置文件",{"path":935,"title":936,"description":937},"\u002Fdocs\u002Ferrors\u002Fe1001","NUXT_E1001","在 Nuxt 上下文之外调用了组合式函数。",{"path":939,"title":940,"description":941},"\u002Fdocs\u002Ferrors\u002Fe1006","NUXT_E1006","onPrehydrate 未被构建流水线处理。",{"path":943,"title":944,"description":945},"\u002Fdocs\u002Ferrors\u002Fe1007","NUXT_E1007","编译期提示辅助函数在运行时被调用。",{"path":947,"title":948,"description":949},"\u002Fdocs\u002Ferrors\u002Fe2001","NUXT_E2001","外部导航未设置 external: true。",{"path":951,"title":952,"description":953},"\u002Fdocs\u002Ferrors\u002Fe2002","NUXT_E2002","使用了危险协议的导航。",{"path":955,"title":956,"description":957},"\u002Fdocs\u002Ferrors\u002Fe2003","NUXT_E2003","abortNavigation() 在中间件之外被调用。",{"path":959,"title":960,"description":961},"\u002Fdocs\u002Ferrors\u002Fe2004","NUXT_E2004","未知的路由中间件。",{"path":963,"title":964,"description":965},"\u002Fdocs\u002Ferrors\u002Fe2005","NUXT_E2005","在中间件内调用了 useRoute。",{"path":967,"title":968,"description":969},"\u002Fdocs\u002Ferrors\u002Fe2007","NUXT_E2007","在组件中于服务端调用了 setPageLayout。",{"path":971,"title":972,"description":973},"\u002Fdocs\u002Ferrors\u002Fe3001","NUXT_E3001","useFetch 的请求 URL 以 \"\u002F\u002F\" 开头。",{"path":975,"title":976,"description":977},"\u002Fdocs\u002Ferrors\u002Fe3008","NUXT_E3008","useAsyncData 的 key 必须是非空字符串。",{"path":979,"title":980,"description":981},"\u002Fdocs\u002Ferrors\u002Fe3009","NUXT_E3009","useAsyncData 的处理函数必须是一个函数。",{"path":983,"title":984,"description":985},"\u002Fdocs\u002Ferrors\u002Fe4012","NUXT_E4012","无法解析 island（岛）响应。",{"path":987,"title":988,"description":989},"\u002Fdocs\u002Ferrors\u002Fe4016","NUXT_E4016","嵌套页面无法显示，因为其父页面没有渲染 \u003CNuxtPage \u002F>。",{"path":991,"title":992,"description":993},"\u002Fdocs\u002Ferrors\u002Fe5001","NUXT_E5001","应用清单（app manifest）未启用。",{"path":995,"title":996,"description":997},"\u002Fdocs\u002Ferrors\u002Fe6001","NUXT_E6001","缺少 Unhead 实例。",{"path":999,"title":1000,"description":1001},"\u002Fdocs\u002Ferrors\u002Fe7001","NUXT_E7001","Payload URL 包含主机名。",{"path":1003,"title":1004,"description":1005},"\u002Fdocs\u002Ferrors\u002Fe7007","NUXT_E7007","useState 的初始化值必须是一个函数。",{"path":1007,"title":1008,"description":1009},"\u002Fdocs\u002Ferrors\u002Fe7008","NUXT_E7008","callOnce 的 fn 必须是一个函数。",{"path":1011,"title":1012,"description":1013},"\u002Fdocs\u002Ferrors\u002Fe7009","NUXT_E7009","useState 的 key 必须是一个字符串。",{"path":1015,"title":1016,"description":1017},"\u002Fdocs\u002Ferrors\u002Fe7010","NUXT_E7010","callOnce 的 key 必须是一个字符串。",{"id":1019,"title":485,"body":1020,"description":486,"extension":3106,"meta":3107,"navigation":3113,"path":484,"seo":3114,"stem":3115,"__hash__":3116},"docs\u002Fdocs\u002F4.api\u002F2.composables\u002Fuse-nuxt-app.md",{"type":1021,"value":1022,"toc":3081},"minimark",[1023,1044,1122,1139,1143,1150,1163,1175,1290,1302,1308,1316,1322,1329,1487,1493,1499,1527,1530,1536,1542,1556,1559,1609,1614,1619,1624,1630,1655,1659,1664,2050,2063,2072,2077,2086,2259,2265,2272,2409,2415,2418,2421,2433,2606,2609,2642,2650,2658,2661,2664,2667,2770,2777,2784,2846,2854,2857,2866,2882,2903,2916,2919,2931,2934,2954,2957,2960,2963,2971,2981,2986,2989,3077],[1024,1025,1026,1029,1030,1035,1036,1039,1040,1043],"p",{},[1027,1028,485],"code",{}," 是一个内置组合式函数，提供了访问 Nuxt 共享运行时上下文的方式，也就是 ",[1031,1032,1034],"a",{"href":1033},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fnuxt-app#the-nuxt-context","Nuxt 上下文","，它在客户端和服务端都可用（但不在 Nitro 路由内）。它帮助你访问 Vue app 实例、运行时钩子、运行时配置变量以及内部状态，例如 ",[1027,1037,1038],{},"ssrContext"," 和 ",[1027,1041,1042],{},"payload","。",[1045,1046,1051],"pre",{"className":1047,"code":1048,"filename":1049,"language":1050,"meta":354,"style":354},"language-vue shiki shiki-themes material-theme-lighter github-dark material-theme-palenight","\u003Cscript setup lang=\"ts\">\nconst nuxtApp = useNuxtApp()\n\u003C\u002Fscript>\n","app\u002Fapp.vue","vue",[1027,1052,1053,1089,1112],{"__ignoreMap":354},[1054,1055,1058,1062,1066,1070,1073,1076,1080,1084,1086],"span",{"class":1056,"line":1057},"line",1,[1054,1059,1061],{"class":1060},"sF54B","\u003C",[1054,1063,1065],{"class":1064},"s6g6u","script",[1054,1067,1069],{"class":1068},"sXjFp"," setup",[1054,1071,1072],{"class":1068}," lang",[1054,1074,1075],{"class":1060},"=",[1054,1077,1079],{"class":1078},"s0jeK","\"",[1054,1081,1083],{"class":1082},"s-Aze","ts",[1054,1085,1079],{"class":1078},[1054,1087,1088],{"class":1060},">\n",[1054,1090,1092,1096,1100,1104,1108],{"class":1056,"line":1091},2,[1054,1093,1095],{"class":1094},"sV7Px","const",[1054,1097,1099],{"class":1098},"sJTDI"," nuxtApp",[1054,1101,1103],{"class":1102},"sXPRQ"," =",[1054,1105,1107],{"class":1106},"srJn9"," useNuxtApp",[1054,1109,1111],{"class":1110},"smVNa","()\n",[1054,1113,1115,1118,1120],{"class":1056,"line":1114},3,[1054,1116,1117],{"class":1060},"\u003C\u002F",[1054,1119,1065],{"class":1064},[1054,1121,1088],{"class":1060},[1024,1123,1124,1125,1127,1128,1134,1135,1138],{},"如果你的作用域中运行时上下文不可用，调用 ",[1027,1126,485],{}," 会抛出异常。你可以改用 ",[1031,1129,1131],{"href":1130},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-nuxt-app#tryusenuxtapp",[1027,1132,1133],{},"tryUseNuxtApp","，它适用于不要求 ",[1027,1136,1137],{},"nuxtApp"," 的组合式函数，或者在不抛异常的情况下简单检查上下文是否可用。",[1140,1141,1142],"h2",{"id":1142},"方法",[1144,1145,1147],"h3",{"id":1146},"provide-name-value",[1027,1148,1149],{},"provide (name, value)",[1024,1151,1152,1154,1155,1158,1159,1162],{},[1027,1153,1137],{}," 是一个运行时上下文，你可以使用 ",[1031,1156,1157],{"href":109},"Nuxt 插件"," 来扩展它。使用 ",[1027,1160,1161],{},"provide"," 函数创建 Nuxt 插件，让你的值和辅助方法在你的 Nuxt 应用中的所有组合式函数和组件里都可用。",[1024,1164,1165,1167,1168,1039,1171,1174],{},[1027,1166,1161],{}," 函数接受 ",[1027,1169,1170],{},"name",[1027,1172,1173],{},"value"," 参数。",[1045,1176,1180],{"className":1177,"code":1178,"filename":1179,"language":1083,"meta":354,"style":354},"language-ts shiki shiki-themes material-theme-lighter github-dark material-theme-palenight","const nuxtApp = useNuxtApp()\nnuxtApp.provide('hello', name => `Hello ${name}!`)\n\n\u002F\u002F 打印 \"Hello name!\"\nconsole.log(nuxtApp.$hello('name'))\n","app\u002Fplugins\u002Fhello.ts",[1027,1181,1182,1194,1247,1253,1260],{"__ignoreMap":354},[1054,1183,1184,1186,1188,1190,1192],{"class":1056,"line":1057},[1054,1185,1095],{"class":1094},[1054,1187,1099],{"class":1098},[1054,1189,1103],{"class":1102},[1054,1191,1107],{"class":1106},[1054,1193,1111],{"class":1110},[1054,1195,1196,1198,1201,1203,1206,1209,1212,1214,1217,1221,1224,1227,1230,1233,1235,1238,1241,1244],{"class":1056,"line":1091},[1054,1197,1137],{"class":1110},[1054,1199,1200],{"class":1060},".",[1054,1202,1161],{"class":1106},[1054,1204,1205],{"class":1110},"(",[1054,1207,1208],{"class":1078},"'",[1054,1210,1211],{"class":1082},"hello",[1054,1213,1208],{"class":1078},[1054,1215,1216],{"class":1060},",",[1054,1218,1220],{"class":1219},"ssIVr"," name",[1054,1222,1223],{"class":1094}," =>",[1054,1225,1226],{"class":1078}," `",[1054,1228,1229],{"class":1082},"Hello ",[1054,1231,1232],{"class":1078},"${",[1054,1234,1170],{"class":1110},[1054,1236,1237],{"class":1078},"}",[1054,1239,1240],{"class":1082},"!",[1054,1242,1243],{"class":1078},"`",[1054,1245,1246],{"class":1110},")\n",[1054,1248,1249],{"class":1056,"line":1114},[1054,1250,1252],{"emptyLinePlaceholder":1251},true,"\n",[1054,1254,1256],{"class":1056,"line":1255},4,[1054,1257,1259],{"class":1258},"sZqJ9","\u002F\u002F 打印 \"Hello name!\"\n",[1054,1261,1263,1266,1268,1271,1274,1276,1279,1281,1283,1285,1287],{"class":1056,"line":1262},5,[1054,1264,1265],{"class":1110},"console",[1054,1267,1200],{"class":1060},[1054,1269,1270],{"class":1106},"log",[1054,1272,1273],{"class":1110},"(nuxtApp",[1054,1275,1200],{"class":1060},[1054,1277,1278],{"class":1106},"$hello",[1054,1280,1205],{"class":1110},[1054,1282,1208],{"class":1078},[1054,1284,1170],{"class":1082},[1054,1286,1208],{"class":1078},[1054,1288,1289],{"class":1110},"))\n",[1024,1291,1292,1293,1295,1296,1298,1299,1301],{},"正如你在上面的示例中看到的，",[1027,1294,1278],{}," 已经成为 ",[1027,1297,1137],{}," 上下文新的自定义部分，并且在所有能访问 ",[1027,1300,1137],{}," 的地方都可用。",[1144,1303,1305],{"id":1304},"hookname-cb",[1027,1306,1307],{},"hook(name, cb)",[1024,1309,1310,1312,1313,1315],{},[1027,1311,1137],{}," 中可用的钩子让你能够自定义 Nuxt 应用的运行时方面。你可以在 Vue.js 组合式函数和 ",[1031,1314,1157],{"href":109}," 中使用运行时钩子，钩入渲染生命周期。",[1024,1317,1318,1321],{},[1027,1319,1320],{},"hook"," 函数用于通过在特定点钩入渲染生命周期来添加自定义逻辑。它最常用于创建 Nuxt 插件。",[1024,1323,1324,1325,1043],{},"关于 Nuxt 调用的可用运行时钩子，请参见 ",[1031,1326,1328],{"href":1327},"\u002Fdocs\u002Fapi\u002Fadvanced\u002Fhooks#app-hooks-runtime","运行时钩子",[1045,1330,1333],{"className":1177,"code":1331,"filename":1332,"language":1083,"meta":354,"style":354},"export default defineNuxtPlugin((nuxtApp) => {\n  nuxtApp.hook('page:start', () => {\n    \u002F* 你的代码写在这里 *\u002F\n  })\n  nuxtApp.hook('vue:error', (..._args) => {\n    console.log('vue:error')\n    \u002F\u002F if (import.meta.client) {\n    \u002F\u002F   console.log(..._args)\n    \u002F\u002F }\n  })\n})\n","app\u002Fplugins\u002Ftest.ts",[1027,1334,1335,1361,1389,1394,1401,1435,1455,1461,1467,1473,1480],{"__ignoreMap":354},[1054,1336,1337,1341,1344,1347,1349,1351,1353,1356,1358],{"class":1056,"line":1057},[1054,1338,1340],{"class":1339},"szyBz","export",[1054,1342,1343],{"class":1339}," default",[1054,1345,1346],{"class":1106}," defineNuxtPlugin",[1054,1348,1205],{"class":1110},[1054,1350,1205],{"class":1060},[1054,1352,1137],{"class":1219},[1054,1354,1355],{"class":1060},")",[1054,1357,1223],{"class":1094},[1054,1359,1360],{"class":1060}," {\n",[1054,1362,1363,1366,1368,1370,1373,1375,1378,1380,1382,1385,1387],{"class":1056,"line":1091},[1054,1364,1365],{"class":1110},"  nuxtApp",[1054,1367,1200],{"class":1060},[1054,1369,1320],{"class":1106},[1054,1371,1205],{"class":1372},"sOtFm",[1054,1374,1208],{"class":1078},[1054,1376,1377],{"class":1082},"page:start",[1054,1379,1208],{"class":1078},[1054,1381,1216],{"class":1060},[1054,1383,1384],{"class":1060}," ()",[1054,1386,1223],{"class":1094},[1054,1388,1360],{"class":1060},[1054,1390,1391],{"class":1056,"line":1114},[1054,1392,1393],{"class":1258},"    \u002F* 你的代码写在这里 *\u002F\n",[1054,1395,1396,1399],{"class":1056,"line":1255},[1054,1397,1398],{"class":1060},"  }",[1054,1400,1246],{"class":1372},[1054,1402,1403,1405,1407,1409,1411,1413,1416,1418,1420,1423,1426,1429,1431,1433],{"class":1056,"line":1262},[1054,1404,1365],{"class":1110},[1054,1406,1200],{"class":1060},[1054,1408,1320],{"class":1106},[1054,1410,1205],{"class":1372},[1054,1412,1208],{"class":1078},[1054,1414,1415],{"class":1082},"vue:error",[1054,1417,1208],{"class":1078},[1054,1419,1216],{"class":1060},[1054,1421,1422],{"class":1060}," (",[1054,1424,1425],{"class":1102},"...",[1054,1427,1428],{"class":1219},"_args",[1054,1430,1355],{"class":1060},[1054,1432,1223],{"class":1094},[1054,1434,1360],{"class":1060},[1054,1436,1438,1441,1443,1445,1447,1449,1451,1453],{"class":1056,"line":1437},6,[1054,1439,1440],{"class":1110},"    console",[1054,1442,1200],{"class":1060},[1054,1444,1270],{"class":1106},[1054,1446,1205],{"class":1372},[1054,1448,1208],{"class":1078},[1054,1450,1415],{"class":1082},[1054,1452,1208],{"class":1078},[1054,1454,1246],{"class":1372},[1054,1456,1458],{"class":1056,"line":1457},7,[1054,1459,1460],{"class":1258},"    \u002F\u002F if (import.meta.client) {\n",[1054,1462,1464],{"class":1056,"line":1463},8,[1054,1465,1466],{"class":1258},"    \u002F\u002F   console.log(..._args)\n",[1054,1468,1470],{"class":1056,"line":1469},9,[1054,1471,1472],{"class":1258},"    \u002F\u002F }\n",[1054,1474,1476,1478],{"class":1056,"line":1475},10,[1054,1477,1398],{"class":1060},[1054,1479,1246],{"class":1372},[1054,1481,1483,1485],{"class":1056,"line":1482},11,[1054,1484,1237],{"class":1060},[1054,1486,1246],{"class":1110},[1144,1488,1490],{"id":1489},"callhookname-args",[1027,1491,1492],{},"callHook(name, ...args)",[1024,1494,1495,1498],{},[1027,1496,1497],{},"callHook"," 在配合任意已有钩子调用时会返回一个 promise。",[1045,1500,1503],{"className":1177,"code":1501,"filename":1502,"language":1083,"meta":354,"style":354},"await nuxtApp.callHook('my-plugin:init')\n","app\u002Fplugins\u002Fmy-plugin.ts",[1027,1504,1505],{"__ignoreMap":354},[1054,1506,1507,1510,1512,1514,1516,1518,1520,1523,1525],{"class":1056,"line":1057},[1054,1508,1509],{"class":1339},"await",[1054,1511,1099],{"class":1110},[1054,1513,1200],{"class":1060},[1054,1515,1497],{"class":1106},[1054,1517,1205],{"class":1110},[1054,1519,1208],{"class":1078},[1054,1521,1522],{"class":1082},"my-plugin:init",[1054,1524,1208],{"class":1078},[1054,1526,1246],{"class":1110},[1140,1528,1529],{"id":1529},"属性",[1024,1531,1532,1535],{},[1027,1533,1534],{},"useNuxtApp()"," 暴露了以下属性，你可以用它们来扩展和自定义你的应用，并共享状态、数据和变量。",[1144,1537,1539],{"id":1538},"vueapp",[1027,1540,1541],{},"vueApp",[1024,1543,1544,1546,1547,1549,1550,1043],{},[1027,1545,1541],{}," 是你可以通过 ",[1027,1548,1137],{}," 访问的全局 Vue.js ",[1031,1551,1555],{"href":1552,"rel":1553},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fapplication#application-api",[1554],"nofollow","应用实例",[1024,1557,1558],{},"一些有用的方法：",[1560,1561,1562,1573,1587],"ul",{},[1563,1564,1565,1572],"li",{},[1031,1566,1569],{"href":1567,"rel":1568},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fapplication#app-component",[1554],[1027,1570,1571],{},"component()"," - 如果同时传入名称字符串和组件定义，则注册一个全局组件；如果只传入名称，则获取已注册的组件。",[1563,1574,1575,1582,1583,1043],{},[1031,1576,1579],{"href":1577,"rel":1578},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fapplication#app-directive",[1554],[1027,1580,1581],{},"directive()"," - 如果同时传入名称字符串和指令定义，则注册一个全局自定义指令；如果只传入名称，则获取已注册的指令",[1031,1584,1586],{"href":1585},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fplugins#vue-directives","(示例)",[1563,1588,1589,1596,1597,1605,1606,1043],{},[1031,1590,1593],{"href":1591,"rel":1592},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fapplication#app-use",[1554],[1027,1594,1595],{},"use()"," - 安装一个 ",[1598,1599,1600],"strong",{},[1031,1601,1604],{"href":1602,"rel":1603},"https:\u002F\u002Fvuejs.org\u002Fguide\u002Freusability\u002Fplugins",[1554],"Vue.js 插件"," ",[1031,1607,1586],{"href":1608},"\u002Fdocs\u002Fdirectory-structure\u002Fapp\u002Fplugins#vue-plugins",[1610,1611],"read-more",{"to":1612,"icon":1613},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fapplication.html#application-api","i-simple-icons-vuedotjs",[1144,1615,1617],{"id":1616},"ssrcontext",[1027,1618,1038],{},[1024,1620,1621,1623],{},[1027,1622,1038],{}," 在服务端渲染期间生成，只在服务端可用。",[1024,1625,1626,1627,1629],{},"Nuxt 通过 ",[1027,1628,1038],{}," 暴露以下属性：",[1560,1631,1632,1638,1650],{},[1563,1633,1634,1637],{},[1027,1635,1636],{},"url","（string）- 当前请求 url。",[1563,1639,1640,1643,1644,1649],{},[1027,1641,1642],{},"event","（",[1031,1645,1648],{"href":1646,"rel":1647},"https:\u002F\u002Fgithub.com\u002Fh3js\u002Fh3",[1554],"h3js\u002Fh3"," 请求事件）- 访问当前路由的请求与响应。",[1563,1651,1652,1654],{},[1027,1653,1042],{},"（object）- NuxtApp payload 对象。",[1144,1656,1657],{"id":1042},[1027,1658,1042],{},[1024,1660,1661,1663],{},[1027,1662,1042],{}," 将数据与状态变量从服务端暴露给客户端。以下键在从服务端传递之后会在客户端可用：",[1560,1665,1666,1672,1883],{},[1563,1667,1668,1671],{},[1027,1669,1670],{},"serverRendered","（boolean）- 指示响应是否由服务端渲染。",[1563,1673,1674,1677,1678,1682,1683,1687,1688,1691,1692,1853,1856,1857,1861,1862,1864,1865,1867,1868,1043,1871,1873,1874,1879,1880,1882],{},[1027,1675,1676],{},"data","（object）- 当你使用 ",[1031,1679,1680],{"href":452},[1027,1681,453],{}," 或 ",[1031,1684,1685],{"href":440},[1027,1686,441],{}," 从 API 端点获取数据时，结果 payload 可以从 ",[1027,1689,1690],{},"payload.data"," 访问。这些数据被缓存，能帮助你避免重复获取相同数据。",[1693,1694,1695,1800],"code-group",{},[1045,1696,1698],{"className":1047,"code":1697,"filename":1049,"language":1050,"meta":354,"style":354},"\u003Cscript setup lang=\"ts\">\nconst { data } = await useAsyncData('count', (_nuxtApp, { signal }) => $fetch('\u002Fapi\u002Fcount', { signal }))\n\u003C\u002Fscript>\n",[1027,1699,1700,1720,1792],{"__ignoreMap":354},[1054,1701,1702,1704,1706,1708,1710,1712,1714,1716,1718],{"class":1056,"line":1057},[1054,1703,1061],{"class":1060},[1054,1705,1065],{"class":1064},[1054,1707,1069],{"class":1068},[1054,1709,1072],{"class":1068},[1054,1711,1075],{"class":1060},[1054,1713,1079],{"class":1078},[1054,1715,1083],{"class":1082},[1054,1717,1079],{"class":1078},[1054,1719,1088],{"class":1060},[1054,1721,1722,1724,1727,1730,1733,1735,1738,1741,1743,1745,1748,1750,1752,1754,1757,1759,1761,1764,1767,1769,1772,1774,1776,1779,1781,1783,1785,1788,1790],{"class":1056,"line":1091},[1054,1723,1095],{"class":1094},[1054,1725,1726],{"class":1060}," {",[1054,1728,1729],{"class":1098}," data",[1054,1731,1732],{"class":1060}," }",[1054,1734,1103],{"class":1102},[1054,1736,1737],{"class":1339}," await",[1054,1739,1740],{"class":1106}," useAsyncData",[1054,1742,1205],{"class":1110},[1054,1744,1208],{"class":1078},[1054,1746,1747],{"class":1082},"count",[1054,1749,1208],{"class":1078},[1054,1751,1216],{"class":1060},[1054,1753,1422],{"class":1060},[1054,1755,1756],{"class":1219},"_nuxtApp",[1054,1758,1216],{"class":1060},[1054,1760,1726],{"class":1060},[1054,1762,1763],{"class":1219}," signal",[1054,1765,1766],{"class":1060}," })",[1054,1768,1223],{"class":1094},[1054,1770,1771],{"class":1106}," $fetch",[1054,1773,1205],{"class":1110},[1054,1775,1208],{"class":1078},[1054,1777,1778],{"class":1082},"\u002Fapi\u002Fcount",[1054,1780,1208],{"class":1078},[1054,1782,1216],{"class":1060},[1054,1784,1726],{"class":1060},[1054,1786,1787],{"class":1110}," signal ",[1054,1789,1237],{"class":1060},[1054,1791,1289],{"class":1110},[1054,1793,1794,1796,1798],{"class":1056,"line":1114},[1054,1795,1117],{"class":1060},[1054,1797,1065],{"class":1064},[1054,1799,1088],{"class":1060},[1045,1801,1804],{"className":1177,"code":1802,"filename":1803,"language":1083,"meta":354,"style":354},"export default defineEventHandler((event) => {\n  return { count: 1 }\n})\n","server\u002Fapi\u002Fcount.ts",[1027,1805,1806,1827,1847],{"__ignoreMap":354},[1054,1807,1808,1810,1812,1815,1817,1819,1821,1823,1825],{"class":1056,"line":1057},[1054,1809,1340],{"class":1339},[1054,1811,1343],{"class":1339},[1054,1813,1814],{"class":1106}," defineEventHandler",[1054,1816,1205],{"class":1110},[1054,1818,1205],{"class":1060},[1054,1820,1642],{"class":1219},[1054,1822,1355],{"class":1060},[1054,1824,1223],{"class":1094},[1054,1826,1360],{"class":1060},[1054,1828,1829,1832,1834,1837,1840,1844],{"class":1056,"line":1091},[1054,1830,1831],{"class":1339},"  return",[1054,1833,1726],{"class":1060},[1054,1835,1836],{"class":1372}," count",[1054,1838,1839],{"class":1060},":",[1054,1841,1843],{"class":1842},"sOUxV"," 1",[1054,1845,1846],{"class":1060}," }\n",[1054,1848,1849,1851],{"class":1056,"line":1114},[1054,1850,1237],{"class":1060},[1054,1852,1246],{"class":1110},[1854,1855],"br",{},"在上面的示例中用 ",[1031,1858,1859],{"href":440},[1027,1860,441],{}," 获取到 ",[1027,1863,1747],{}," 的值之后，如果你访问 ",[1027,1866,1690],{},"，会看到其中记录着 ",[1027,1869,1870],{},"{ count: 1 }",[1854,1872],{},"当从 ",[1031,1875,1877],{"href":1876},"\u002Fdocs\u002Fapi\u002Fcomposables\u002Fuse-nuxt-app#ssrcontext",[1027,1878,1616],{}," 访问相同的 ",[1027,1881,1690],{}," 时，你在服务端侧也能访问相同的值。",[1563,1884,1885,1888,1889,1893,1894,1897,1898,2031,2033,2034,2037,2038,2037,2041,2037,2044,1039,2047,1043],{},[1027,1886,1887],{},"state","（object）- 当在 Nuxt 中使用 ",[1031,1890,1891],{"href":548},[1027,1892,549],{}," 组合式函数设置共享状态时，该状态数据通过 ",[1027,1895,1896],{},"payload.state.[你的状态名称]"," 访问。",[1045,1899,1901],{"className":1177,"code":1900,"filename":1502,"language":1083,"meta":354,"style":354},"export const useColor = () => useState\u003Cstring>('color', () => 'pink')\n\nexport default defineNuxtPlugin((nuxtApp) => {\n  if (import.meta.server) {\n    const color = useColor()\n  }\n})\n",[1027,1902,1903,1957,1961,1981,2006,2020,2025],{"__ignoreMap":354},[1054,1904,1905,1907,1910,1914,1916,1918,1920,1923,1925,1929,1932,1934,1936,1939,1941,1943,1945,1947,1950,1953,1955],{"class":1056,"line":1057},[1054,1906,1340],{"class":1339},[1054,1908,1909],{"class":1094}," const",[1054,1911,1913],{"class":1912},"s5Y2e"," useColor",[1054,1915,1103],{"class":1102},[1054,1917,1384],{"class":1060},[1054,1919,1223],{"class":1094},[1054,1921,1922],{"class":1106}," useState",[1054,1924,1061],{"class":1060},[1054,1926,1928],{"class":1927},"seQRr","string",[1054,1930,1931],{"class":1060},">",[1054,1933,1205],{"class":1110},[1054,1935,1208],{"class":1078},[1054,1937,1938],{"class":1082},"color",[1054,1940,1208],{"class":1078},[1054,1942,1216],{"class":1060},[1054,1944,1384],{"class":1060},[1054,1946,1223],{"class":1094},[1054,1948,1949],{"class":1078}," '",[1054,1951,1952],{"class":1082},"pink",[1054,1954,1208],{"class":1078},[1054,1956,1246],{"class":1110},[1054,1958,1959],{"class":1056,"line":1091},[1054,1960,1252],{"emptyLinePlaceholder":1251},[1054,1962,1963,1965,1967,1969,1971,1973,1975,1977,1979],{"class":1056,"line":1114},[1054,1964,1340],{"class":1339},[1054,1966,1343],{"class":1339},[1054,1968,1346],{"class":1106},[1054,1970,1205],{"class":1110},[1054,1972,1205],{"class":1060},[1054,1974,1137],{"class":1219},[1054,1976,1355],{"class":1060},[1054,1978,1223],{"class":1094},[1054,1980,1360],{"class":1060},[1054,1982,1983,1986,1988,1991,1993,1996,1998,2000,2003],{"class":1056,"line":1255},[1054,1984,1985],{"class":1339},"  if",[1054,1987,1422],{"class":1372},[1054,1989,1990],{"class":1339},"import",[1054,1992,1200],{"class":1060},[1054,1994,1995],{"class":1098},"meta",[1054,1997,1200],{"class":1060},[1054,1999,150],{"class":1110},[1054,2001,2002],{"class":1372},") ",[1054,2004,2005],{"class":1060},"{\n",[1054,2007,2008,2011,2014,2016,2018],{"class":1056,"line":1262},[1054,2009,2010],{"class":1094},"    const",[1054,2012,2013],{"class":1098}," color",[1054,2015,1103],{"class":1102},[1054,2017,1913],{"class":1106},[1054,2019,1111],{"class":1372},[1054,2021,2022],{"class":1056,"line":1437},[1054,2023,2024],{"class":1060},"  }\n",[1054,2026,2027,2029],{"class":1056,"line":1457},[1054,2028,1237],{"class":1060},[1054,2030,1246],{"class":1110},[1854,2032],{},"也可以使用更高级的类型，例如 ",[1027,2035,2036],{},"ref","、",[1027,2039,2040],{},"reactive",[1027,2042,2043],{},"shallowRef",[1027,2045,2046],{},"shallowReactive",[1027,2048,2049],{},"NuxtError",[2051,2052,2054,2055],"h4",{"id":2053},"自定义-reducerreviver-v34","自定义 Reducer\u002FReviver ",[2056,2057,2062],"badge",{"className":2058,"color":2060,"size":2061},[2059],"align-middle","info","xs","v3.4",[1024,2064,2065,2066,2071],{},"自 ",[1031,2067,2070],{"href":2068,"rel":2069},"https:\u002F\u002Fnuxt.com\u002Fblog\u002Fv3-4#payload-enhancements",[1554],"Nuxt v3.4"," 起，你可以为 Nuxt 不支持的类型定义自己的 reducer\u002Freviver。",[2073,2074],"video-accordion",{"title":2075,"video-id":2076},"观看 Alexander Lichter 关于序列化 payload 的视频，特别是关于类的部分","8w6ffRBs8a4",[1024,2078,2079,2080,2085],{},"在下面的示例中，我们使用 payload 插件为 ",[1031,2081,2084],{"href":2082,"rel":2083},"https:\u002F\u002Fmoment.github.io\u002Fluxon\u002F#\u002F",[1554],"Luxon"," 的 DateTime 类定义 reducer（序列化器）和 reviver（反序列化器）。",[1045,2087,2090],{"className":1177,"code":2088,"filename":2089,"language":1083,"meta":354,"style":354},"\u002F**\n * 这类插件在 Nuxt 生命周期中运行得非常早，在我们恢复 payload 之前。\n * 你将无法访问 router 或其他 Nuxt 注入的属性。\n *\n * 注意 \"DateTime\" 字符串是类型标识符，在 reducer 和 reviver 中必须相同。\n *\u002F\nexport default definePayloadPlugin((nuxtApp) => {\n  definePayloadReducer('DateTime', (value) => {\n    return value instanceof DateTime && value.toJSON()\n  })\n  definePayloadReviver('DateTime', (value) => {\n    return DateTime.fromISO(value)\n  })\n})\n","app\u002Fplugins\u002Fdate-time-payload.ts",[1027,2091,2092,2097,2102,2107,2112,2117,2122,2143,2169,2196,2202,2227,2245,2252],{"__ignoreMap":354},[1054,2093,2094],{"class":1056,"line":1057},[1054,2095,2096],{"class":1258},"\u002F**\n",[1054,2098,2099],{"class":1056,"line":1091},[1054,2100,2101],{"class":1258}," * 这类插件在 Nuxt 生命周期中运行得非常早，在我们恢复 payload 之前。\n",[1054,2103,2104],{"class":1056,"line":1114},[1054,2105,2106],{"class":1258}," * 你将无法访问 router 或其他 Nuxt 注入的属性。\n",[1054,2108,2109],{"class":1056,"line":1255},[1054,2110,2111],{"class":1258}," *\n",[1054,2113,2114],{"class":1056,"line":1262},[1054,2115,2116],{"class":1258}," * 注意 \"DateTime\" 字符串是类型标识符，在 reducer 和 reviver 中必须相同。\n",[1054,2118,2119],{"class":1056,"line":1437},[1054,2120,2121],{"class":1258}," *\u002F\n",[1054,2123,2124,2126,2128,2131,2133,2135,2137,2139,2141],{"class":1056,"line":1457},[1054,2125,1340],{"class":1339},[1054,2127,1343],{"class":1339},[1054,2129,2130],{"class":1106}," definePayloadPlugin",[1054,2132,1205],{"class":1110},[1054,2134,1205],{"class":1060},[1054,2136,1137],{"class":1219},[1054,2138,1355],{"class":1060},[1054,2140,1223],{"class":1094},[1054,2142,1360],{"class":1060},[1054,2144,2145,2148,2150,2152,2155,2157,2159,2161,2163,2165,2167],{"class":1056,"line":1463},[1054,2146,2147],{"class":1106},"  definePayloadReducer",[1054,2149,1205],{"class":1372},[1054,2151,1208],{"class":1078},[1054,2153,2154],{"class":1082},"DateTime",[1054,2156,1208],{"class":1078},[1054,2158,1216],{"class":1060},[1054,2160,1422],{"class":1060},[1054,2162,1173],{"class":1219},[1054,2164,1355],{"class":1060},[1054,2166,1223],{"class":1094},[1054,2168,1360],{"class":1060},[1054,2170,2171,2174,2177,2180,2184,2187,2189,2191,2194],{"class":1056,"line":1469},[1054,2172,2173],{"class":1339},"    return",[1054,2175,2176],{"class":1110}," value",[1054,2178,2179],{"class":1102}," instanceof",[1054,2181,2183],{"class":2182},"sJK67"," DateTime",[1054,2185,2186],{"class":1102}," &&",[1054,2188,2176],{"class":1110},[1054,2190,1200],{"class":1060},[1054,2192,2193],{"class":1106},"toJSON",[1054,2195,1111],{"class":1372},[1054,2197,2198,2200],{"class":1056,"line":1475},[1054,2199,1398],{"class":1060},[1054,2201,1246],{"class":1372},[1054,2203,2204,2207,2209,2211,2213,2215,2217,2219,2221,2223,2225],{"class":1056,"line":1482},[1054,2205,2206],{"class":1106},"  definePayloadReviver",[1054,2208,1205],{"class":1372},[1054,2210,1208],{"class":1078},[1054,2212,2154],{"class":1082},[1054,2214,1208],{"class":1078},[1054,2216,1216],{"class":1060},[1054,2218,1422],{"class":1060},[1054,2220,1173],{"class":1219},[1054,2222,1355],{"class":1060},[1054,2224,1223],{"class":1094},[1054,2226,1360],{"class":1060},[1054,2228,2230,2232,2234,2236,2239,2241,2243],{"class":1056,"line":2229},12,[1054,2231,2173],{"class":1339},[1054,2233,2183],{"class":1110},[1054,2235,1200],{"class":1060},[1054,2237,2238],{"class":1106},"fromISO",[1054,2240,1205],{"class":1372},[1054,2242,1173],{"class":1110},[1054,2244,1246],{"class":1372},[1054,2246,2248,2250],{"class":1056,"line":2247},13,[1054,2249,1398],{"class":1060},[1054,2251,1246],{"class":1372},[1054,2253,2255,2257],{"class":1056,"line":2254},14,[1054,2256,1237],{"class":1060},[1054,2258,1246],{"class":1110},[1144,2260,2262],{"id":2261},"ishydrating",[1027,2263,2264],{},"isHydrating",[1024,2266,2267,2268,2271],{},"使用 ",[1027,2269,2270],{},"nuxtApp.isHydrating","（boolean）来检查 Nuxt 应用是否正在客户端进行 hydration。",[1045,2273,2276],{"className":1177,"code":2274,"filename":2275,"language":1083,"meta":354,"style":354},"export default defineComponent({\n  setup (_props, { slots, emit }) {\n    const nuxtApp = useNuxtApp()\n    onErrorCaptured((err) => {\n      if (import.meta.client && !nuxtApp.isHydrating) {\n        \u002F\u002F ...\n      }\n    })\n  },\n})\n","app\u002Fcomponents\u002Fnuxt-error-boundary.ts",[1027,2277,2278,2291,2318,2330,2348,2381,2386,2391,2398,2403],{"__ignoreMap":354},[1054,2279,2280,2282,2284,2287,2289],{"class":1056,"line":1057},[1054,2281,1340],{"class":1339},[1054,2283,1343],{"class":1339},[1054,2285,2286],{"class":1106}," defineComponent",[1054,2288,1205],{"class":1110},[1054,2290,2005],{"class":1060},[1054,2292,2293,2297,2299,2302,2304,2306,2309,2311,2314,2316],{"class":1056,"line":1091},[1054,2294,2296],{"class":2295},"syA7L","  setup",[1054,2298,1422],{"class":1060},[1054,2300,2301],{"class":1219},"_props",[1054,2303,1216],{"class":1060},[1054,2305,1726],{"class":1060},[1054,2307,2308],{"class":1219}," slots",[1054,2310,1216],{"class":1060},[1054,2312,2313],{"class":1219}," emit",[1054,2315,1766],{"class":1060},[1054,2317,1360],{"class":1060},[1054,2319,2320,2322,2324,2326,2328],{"class":1056,"line":1114},[1054,2321,2010],{"class":1094},[1054,2323,1099],{"class":1098},[1054,2325,1103],{"class":1102},[1054,2327,1107],{"class":1106},[1054,2329,1111],{"class":1372},[1054,2331,2332,2335,2337,2339,2342,2344,2346],{"class":1056,"line":1255},[1054,2333,2334],{"class":1106},"    onErrorCaptured",[1054,2336,1205],{"class":1372},[1054,2338,1205],{"class":1060},[1054,2340,2341],{"class":1219},"err",[1054,2343,1355],{"class":1060},[1054,2345,1223],{"class":1094},[1054,2347,1360],{"class":1060},[1054,2349,2350,2353,2355,2357,2359,2361,2363,2366,2368,2371,2373,2375,2377,2379],{"class":1056,"line":1262},[1054,2351,2352],{"class":1339},"      if",[1054,2354,1422],{"class":1372},[1054,2356,1990],{"class":1339},[1054,2358,1200],{"class":1060},[1054,2360,1995],{"class":1098},[1054,2362,1200],{"class":1060},[1054,2364,2365],{"class":1110},"client",[1054,2367,2186],{"class":1102},[1054,2369,2370],{"class":1102}," !",[1054,2372,1137],{"class":1110},[1054,2374,1200],{"class":1060},[1054,2376,2264],{"class":1110},[1054,2378,2002],{"class":1372},[1054,2380,2005],{"class":1060},[1054,2382,2383],{"class":1056,"line":1437},[1054,2384,2385],{"class":1258},"        \u002F\u002F ...\n",[1054,2387,2388],{"class":1056,"line":1457},[1054,2389,2390],{"class":1060},"      }\n",[1054,2392,2393,2396],{"class":1056,"line":1463},[1054,2394,2395],{"class":1060},"    }",[1054,2397,1246],{"class":1372},[1054,2399,2400],{"class":1056,"line":1469},[1054,2401,2402],{"class":1060},"  },\n",[1054,2404,2405,2407],{"class":1056,"line":1475},[1054,2406,1237],{"class":1060},[1054,2408,1246],{"class":1110},[1144,2410,2412],{"id":2411},"runwithcontext",[1027,2413,2414],{},"runWithContext",[2416,2417],"note",{},[1024,2419,2420],{},"你很可能是因为收到「Nuxt instance unavailable」消息才来到这里。请谨慎使用此方法，并报告导致问题的示例，以便最终能在框架层面解决。\n:",[1024,2422,2423,2425,2426,2429,2430,2432],{},[1027,2424,2414],{}," 方法用于调用一个函数并为其提供显式的 Nuxt 上下文。通常，Nuxt 上下文是隐式传递的，你无需为此担心。然而，在处理中间件\u002F插件中复杂的 ",[1027,2427,2428],{},"async","\u002F",[1027,2431,1509],{}," 场景时，你可能会遇到当前实例在异步调用后被取消设置的情况。",[1045,2434,2437],{"className":1177,"code":2435,"filename":2436,"language":1083,"meta":354,"style":354},"export default defineNuxtRouteMiddleware(async (to, from) => {\n  const nuxtApp = useNuxtApp()\n  let user\n  try {\n    user = await fetchUser()\n    \u002F\u002F 由于 try\u002Fcatch 块，Vue\u002FNuxt 编译器在这里丢失了上下文。\n  } catch (e) {\n    user = null\n  }\n  if (!user) {\n    \u002F\u002F 将正确的 Nuxt 上下文应用到我们的 `navigateTo` 调用上。\n    return nuxtApp.runWithContext(() => navigateTo('\u002Fauth'))\n  }\n})\n","app\u002Fmiddleware\u002Fauth.ts",[1027,2438,2439,2468,2481,2489,2496,2510,2515,2531,2541,2545,2560,2565,2596,2600],{"__ignoreMap":354},[1054,2440,2441,2443,2445,2448,2450,2452,2454,2457,2459,2462,2464,2466],{"class":1056,"line":1057},[1054,2442,1340],{"class":1339},[1054,2444,1343],{"class":1339},[1054,2446,2447],{"class":1106}," defineNuxtRouteMiddleware",[1054,2449,1205],{"class":1110},[1054,2451,2428],{"class":1094},[1054,2453,1422],{"class":1060},[1054,2455,2456],{"class":1219},"to",[1054,2458,1216],{"class":1060},[1054,2460,2461],{"class":1219}," from",[1054,2463,1355],{"class":1060},[1054,2465,1223],{"class":1094},[1054,2467,1360],{"class":1060},[1054,2469,2470,2473,2475,2477,2479],{"class":1056,"line":1091},[1054,2471,2472],{"class":1094},"  const",[1054,2474,1099],{"class":1098},[1054,2476,1103],{"class":1102},[1054,2478,1107],{"class":1106},[1054,2480,1111],{"class":1372},[1054,2482,2483,2486],{"class":1056,"line":1114},[1054,2484,2485],{"class":1094},"  let",[1054,2487,2488],{"class":1110}," user\n",[1054,2490,2491,2494],{"class":1056,"line":1255},[1054,2492,2493],{"class":1339},"  try",[1054,2495,1360],{"class":1060},[1054,2497,2498,2501,2503,2505,2508],{"class":1056,"line":1262},[1054,2499,2500],{"class":1110},"    user",[1054,2502,1103],{"class":1102},[1054,2504,1737],{"class":1339},[1054,2506,2507],{"class":1106}," fetchUser",[1054,2509,1111],{"class":1372},[1054,2511,2512],{"class":1056,"line":1437},[1054,2513,2514],{"class":1258},"    \u002F\u002F 由于 try\u002Fcatch 块，Vue\u002FNuxt 编译器在这里丢失了上下文。\n",[1054,2516,2517,2519,2522,2524,2527,2529],{"class":1056,"line":1457},[1054,2518,1398],{"class":1060},[1054,2520,2521],{"class":1339}," catch",[1054,2523,1422],{"class":1372},[1054,2525,2526],{"class":1110},"e",[1054,2528,2002],{"class":1372},[1054,2530,2005],{"class":1060},[1054,2532,2533,2535,2537],{"class":1056,"line":1463},[1054,2534,2500],{"class":1110},[1054,2536,1103],{"class":1102},[1054,2538,2540],{"class":2539},"s0q4w"," null\n",[1054,2542,2543],{"class":1056,"line":1469},[1054,2544,2024],{"class":1060},[1054,2546,2547,2549,2551,2553,2556,2558],{"class":1056,"line":1475},[1054,2548,1985],{"class":1339},[1054,2550,1422],{"class":1372},[1054,2552,1240],{"class":1102},[1054,2554,2555],{"class":1110},"user",[1054,2557,2002],{"class":1372},[1054,2559,2005],{"class":1060},[1054,2561,2562],{"class":1056,"line":1482},[1054,2563,2564],{"class":1258},"    \u002F\u002F 将正确的 Nuxt 上下文应用到我们的 `navigateTo` 调用上。\n",[1054,2566,2567,2569,2571,2573,2575,2577,2580,2582,2585,2587,2589,2592,2594],{"class":1056,"line":2229},[1054,2568,2173],{"class":1339},[1054,2570,1099],{"class":1110},[1054,2572,1200],{"class":1060},[1054,2574,2414],{"class":1106},[1054,2576,1205],{"class":1372},[1054,2578,2579],{"class":1060},"()",[1054,2581,1223],{"class":1094},[1054,2583,2584],{"class":1106}," navigateTo",[1054,2586,1205],{"class":1372},[1054,2588,1208],{"class":1078},[1054,2590,2591],{"class":1082},"\u002Fauth",[1054,2593,1208],{"class":1078},[1054,2595,1289],{"class":1372},[1054,2597,2598],{"class":1056,"line":2247},[1054,2599,2024],{"class":1060},[1054,2601,2602,2604],{"class":1056,"line":2254},[1054,2603,1237],{"class":1060},[1054,2605,1246],{"class":1110},[2051,2607,2608],{"id":2608},"用法",[1045,2610,2613],{"className":1177,"code":2611,"filename":2612,"language":1083,"meta":354,"style":354},"const result = nuxtApp.runWithContext(() => functionWithContext())\n","Usage",[1027,2614,2615],{"__ignoreMap":354},[1054,2616,2617,2619,2622,2624,2626,2628,2630,2632,2634,2636,2639],{"class":1056,"line":1057},[1054,2618,1095],{"class":1094},[1054,2620,2621],{"class":1098}," result",[1054,2623,1103],{"class":1102},[1054,2625,1099],{"class":1110},[1054,2627,1200],{"class":1060},[1054,2629,2414],{"class":1106},[1054,2631,1205],{"class":1110},[1054,2633,2579],{"class":1060},[1054,2635,1223],{"class":1094},[1054,2637,2638],{"class":1106}," functionWithContext",[1054,2640,2641],{"class":1110},"())\n",[1560,2643,2644],{},[1563,2645,2646,2649],{},[1027,2647,2648],{},"functionWithContext","：任何需要当前 Nuxt 应用上下文的函数。该上下文会被自动正确应用。",[1024,2651,2652,2654,2655,2657],{},[1027,2653,2414],{}," 会返回 ",[1027,2656,2648],{}," 返回的任何值。",[2051,2659,2660],{"id":2660},"关于上下文的深入解释",[1024,2662,2663],{},"Vue.js 组合式 API（以及类似的 Nuxt 组合式函数）依赖于隐式上下文来工作。在生命周期中，Vue 将当前组件的临时实例（以及 Nuxt 的 nuxtApp 临时实例）设置到一个全局变量上，并在同一 tick 中取消设置。在服务端渲染时，来自不同用户的多个请求和 nuxtApp 运行在同一个全局上下文中。正因如此，Nuxt 和 Vue 会立即取消设置这个全局实例，以避免在两个用户或组件之间泄漏共享引用。",[1024,2665,2666],{},"这意味着什么？组合式 API 和 Nuxt 组合式函数只在生命周期内、且在任何异步操作之前的同一 tick 中可用：",[1045,2668,2671],{"className":1177,"code":2669,"filename":2670,"language":1083,"meta":354,"style":354},"\u002F\u002F --- Vue 内部 ---\nconst _vueInstance = null\nconst getCurrentInstance = () => _vueInstance\n\u002F\u002F ---\n\n\u002F\u002F Vue \u002F Nuxt 在调用 setup() 时将引用当前组件的全局变量设置到 _vueInstance 中\nasync function setup () {\n  getCurrentInstance() \u002F\u002F 可用\n  await someAsyncOperation() \u002F\u002F Vue 在同一 tick 中、异步操作之前取消设置上下文！\n  getCurrentInstance() \u002F\u002F null\n}\n","概念示例",[1027,2672,2673,2678,2689,2705,2710,2714,2719,2732,2743,2756,2765],{"__ignoreMap":354},[1054,2674,2675],{"class":1056,"line":1057},[1054,2676,2677],{"class":1258},"\u002F\u002F --- Vue 内部 ---\n",[1054,2679,2680,2682,2685,2687],{"class":1056,"line":1091},[1054,2681,1095],{"class":1094},[1054,2683,2684],{"class":1098}," _vueInstance",[1054,2686,1103],{"class":1102},[1054,2688,2540],{"class":2539},[1054,2690,2691,2693,2696,2698,2700,2702],{"class":1056,"line":1114},[1054,2692,1095],{"class":1094},[1054,2694,2695],{"class":1912}," getCurrentInstance",[1054,2697,1103],{"class":1102},[1054,2699,1384],{"class":1060},[1054,2701,1223],{"class":1094},[1054,2703,2704],{"class":1110}," _vueInstance\n",[1054,2706,2707],{"class":1056,"line":1255},[1054,2708,2709],{"class":1258},"\u002F\u002F ---\n",[1054,2711,2712],{"class":1056,"line":1262},[1054,2713,1252],{"emptyLinePlaceholder":1251},[1054,2715,2716],{"class":1056,"line":1437},[1054,2717,2718],{"class":1258},"\u002F\u002F Vue \u002F Nuxt 在调用 setup() 时将引用当前组件的全局变量设置到 _vueInstance 中\n",[1054,2720,2721,2723,2726,2728,2730],{"class":1056,"line":1457},[1054,2722,2428],{"class":1094},[1054,2724,2725],{"class":1094}," function",[1054,2727,1069],{"class":1106},[1054,2729,1384],{"class":1060},[1054,2731,1360],{"class":1060},[1054,2733,2734,2737,2740],{"class":1056,"line":1463},[1054,2735,2736],{"class":1106},"  getCurrentInstance",[1054,2738,2739],{"class":1372},"() ",[1054,2741,2742],{"class":1258},"\u002F\u002F 可用\n",[1054,2744,2745,2748,2751,2753],{"class":1056,"line":1469},[1054,2746,2747],{"class":1339},"  await",[1054,2749,2750],{"class":1106}," someAsyncOperation",[1054,2752,2739],{"class":1372},[1054,2754,2755],{"class":1258},"\u002F\u002F Vue 在同一 tick 中、异步操作之前取消设置上下文！\n",[1054,2757,2758,2760,2762],{"class":1056,"line":1475},[1054,2759,2736],{"class":1106},[1054,2761,2739],{"class":1372},[1054,2763,2764],{"class":1258},"\u002F\u002F null\n",[1054,2766,2767],{"class":1056,"line":1482},[1054,2768,2769],{"class":1060},"}\n",[1024,2771,2772,2773,2776],{},"经典的解决方案是，在首次调用时将当前实例缓存到一个局部变量，如 ",[1027,2774,2775],{},"const instance = getCurrentInstance()","，并在下一次组合式函数调用中使用它；但问题在于，任何嵌套的组合式函数调用现在都需要显式接受该实例作为参数，而不能依赖组合式 API 的隐式上下文。这是组合式函数的设计限制，本身并非问题。",[1024,2778,2779,2780,2783],{},"为了克服这个限制，Vue 在编译应用代码时会做一些幕后工作，并在每次 ",[1027,2781,2782],{},"\u003Cscript setup>"," 调用之后恢复上下文：",[1045,2785,2788],{"className":1177,"code":2786,"filename":2787,"language":1083,"meta":354,"style":354},"const __instance = getCurrentInstance() \u002F\u002F 由 Vue 编译器生成\ngetCurrentInstance() \u002F\u002F 可用！\nawait someAsyncOperation() \u002F\u002F Vue 取消设置上下文\n__restoreInstance(__instance) \u002F\u002F 由 Vue 编译器生成\ngetCurrentInstance() \u002F\u002F 仍然可用！\n","编译输出",[1027,2789,2790,2806,2816,2827,2837],{"__ignoreMap":354},[1054,2791,2792,2794,2797,2799,2801,2803],{"class":1056,"line":1057},[1054,2793,1095],{"class":1094},[1054,2795,2796],{"class":1098}," __instance",[1054,2798,1103],{"class":1102},[1054,2800,2695],{"class":1106},[1054,2802,2739],{"class":1110},[1054,2804,2805],{"class":1258},"\u002F\u002F 由 Vue 编译器生成\n",[1054,2807,2808,2811,2813],{"class":1056,"line":1091},[1054,2809,2810],{"class":1106},"getCurrentInstance",[1054,2812,2739],{"class":1110},[1054,2814,2815],{"class":1258},"\u002F\u002F 可用！\n",[1054,2817,2818,2820,2822,2824],{"class":1056,"line":1114},[1054,2819,1509],{"class":1339},[1054,2821,2750],{"class":1106},[1054,2823,2739],{"class":1110},[1054,2825,2826],{"class":1258},"\u002F\u002F Vue 取消设置上下文\n",[1054,2828,2829,2832,2835],{"class":1056,"line":1255},[1054,2830,2831],{"class":1106},"__restoreInstance",[1054,2833,2834],{"class":1110},"(__instance) ",[1054,2836,2805],{"class":1258},[1054,2838,2839,2841,2843],{"class":1056,"line":1262},[1054,2840,2810],{"class":1106},[1054,2842,2739],{"class":1110},[1054,2844,2845],{"class":1258},"\u002F\u002F 仍然可用！\n",[1024,2847,2848,2849,1043],{},"关于 Vue 实际做了什么的更好描述，请参见 ",[1031,2850,2853],{"href":2851,"rel":2852},"https:\u002F\u002Fgithub.com\u002Funjs\u002Functx\u002Fissues\u002F2#issuecomment-942193723",[1554],"unjs\u002Functx#2 (评论)",[2051,2855,2856],{"id":2856},"解决方案",[1024,2858,2859,2860,2862,2863,2865],{},"这正是 ",[1027,2861,2414],{}," 可以用来恢复上下文的地方，其工作方式与 ",[1027,2864,2782],{}," 类似。",[1024,2867,2868,2869,2874,2875,2878,2879,2881],{},"Nuxt 内部使用 ",[1031,2870,2873],{"href":2871,"rel":2872},"https:\u002F\u002Fgithub.com\u002Funjs\u002Functx",[1554],"unjs\u002Functx"," 来支持类似于 Vue 的组合式函数，以用于插件和中间件。这使得诸如 ",[1027,2876,2877],{},"navigateTo()"," 之类的组合式函数无需直接向其传入 ",[1027,2880,1137],{}," 就能工作——将组合式 API 的开发体验和性能优势带给了整个 Nuxt 框架。",[1024,2883,2884,2885,2890,2891,2896,2897,2902],{},"Nuxt 组合式函数与 Vue 组合式 API 拥有相同的设计，因此需要类似的方案来自动完成这个转换。查看 ",[1031,2886,2889],{"href":2887,"rel":2888},"https:\u002F\u002Fgithub.com\u002Funjs\u002Functx\u002Fissues\u002F2",[1554],"unjs\u002Functx#2","（提案）、",[1031,2892,2895],{"href":2893,"rel":2894},"https:\u002F\u002Fgithub.com\u002Funjs\u002Functx\u002Fpull\u002F4",[1554],"unjs\u002Functx#4","（转换实现），以及 ",[1031,2898,2901],{"href":2899,"rel":2900},"https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fframework\u002Fpull\u002F3884",[1554],"nuxt\u002Fframework#3884","（集成到 Nuxt）。",[1024,2904,2905,2906,2908,2909,1039,2912,2915],{},"Vue 目前只支持 ",[1027,2907,2782],{}," 中异步\u002Fawait 用法的异步上下文恢复。在 Nuxt 中，",[1027,2910,2911],{},"defineNuxtPlugin()",[1027,2913,2914],{},"defineNuxtRouteMiddleware()"," 的转换支持已被添加，这意味着当你使用它们时，Nuxt 会自动对它们进行上下文恢复转换。",[2051,2917,2918],{"id":2918},"剩余问题",[1024,2920,2921,2923,2924,2926,2927,2930],{},[1027,2922,2873],{}," 自动恢复上下文的转换在包含 ",[1027,2925,1509],{}," 的 ",[1027,2928,2929],{},"try\u002Fcatch"," 语句中似乎存在问题，这最终需要被解决，才能移除上面变通方案的要求。",[2051,2932,2933],{"id":2933},"原生异步上下文",[1024,2935,2936,2937,2945,2946,2949,2950,2953],{},"使用一个实验性新特性，可以启用原生异步上下文支持，通过 ",[1031,2938,2941,2942],{"href":2939,"rel":2940},"https:\u002F\u002Fnodejs.org\u002Fapi\u002Fasync_context.html#class-asynclocalstorage",[1554],"Node.js ",[1027,2943,2944],{},"AsyncLocalStorage"," 和新的 unctx 支持，将异步上下文",[1598,2947,2948],{},"原生地","提供给",[1598,2951,2952],{},"任何嵌套的异步组合式函数","，而无需转换或手动传递\u002F调用上下文。",[2955,2956],"tip",{},[1024,2958,2959],{},"原生异步上下文支持目前可在 Bun 和 Node 中工作。\n:",[1610,2961],{"to":2962},"\u002Fdocs\u002Fguide\u002Fgoing-further\u002Fexperimental-features#asynccontext",[1140,2964,2966,2967],{"id":2965},"tryusenuxtapp-v310","tryUseNuxtApp ",[2056,2968,2970],{"className":2969,"color":2060,"size":2061},[2059],"v3.10",[1024,2972,2973,2974,2976,2977,2980],{},"该函数的工作方式与 ",[1027,2975,485],{}," 完全相同，但如果上下文不可用，则返回 ",[1027,2978,2979],{},"null"," 而不是抛出异常。",[1024,2982,2983,2984,1138],{},"你可以将它用于不要求 ",[1027,2985,1137],{},[1024,2987,2988],{},"示例用法：",[1045,2990,2993],{"className":1177,"code":2991,"filename":2992,"language":1083,"meta":354,"style":354},"export function useStandType () {\n  \u002F\u002F 在客户端始终可用\n  if (tryUseNuxtApp()) {\n    return useRuntimeConfig().public.STAND_TYPE\n  } else {\n    return process.env.STAND_TYPE\n  }\n}\n","composable.ts",[1027,2994,2995,3008,3013,3026,3044,3053,3069,3073],{"__ignoreMap":354},[1054,2996,2997,2999,3001,3004,3006],{"class":1056,"line":1057},[1054,2998,1340],{"class":1339},[1054,3000,2725],{"class":1094},[1054,3002,3003],{"class":1106}," useStandType",[1054,3005,1384],{"class":1060},[1054,3007,1360],{"class":1060},[1054,3009,3010],{"class":1056,"line":1091},[1054,3011,3012],{"class":1258},"  \u002F\u002F 在客户端始终可用\n",[1054,3014,3015,3017,3019,3021,3024],{"class":1056,"line":1114},[1054,3016,1985],{"class":1339},[1054,3018,1422],{"class":1372},[1054,3020,1133],{"class":1106},[1054,3022,3023],{"class":1372},"()) ",[1054,3025,2005],{"class":1060},[1054,3027,3028,3030,3033,3035,3037,3039,3041],{"class":1056,"line":1255},[1054,3029,2173],{"class":1339},[1054,3031,3032],{"class":1106}," useRuntimeConfig",[1054,3034,2579],{"class":1372},[1054,3036,1200],{"class":1060},[1054,3038,146],{"class":1110},[1054,3040,1200],{"class":1060},[1054,3042,3043],{"class":1098},"STAND_TYPE\n",[1054,3045,3046,3048,3051],{"class":1056,"line":1262},[1054,3047,1398],{"class":1060},[1054,3049,3050],{"class":1339}," else",[1054,3052,1360],{"class":1060},[1054,3054,3055,3057,3060,3062,3065,3067],{"class":1056,"line":1437},[1054,3056,2173],{"class":1339},[1054,3058,3059],{"class":1110}," process",[1054,3061,1200],{"class":1060},[1054,3063,3064],{"class":1110},"env",[1054,3066,1200],{"class":1060},[1054,3068,3043],{"class":1098},[1054,3070,3071],{"class":1056,"line":1457},[1054,3072,2024],{"class":1060},[1054,3074,3075],{"class":1056,"line":1463},[1054,3076,2769],{"class":1060},[3078,3079,3080],"style",{},"html pre.shiki code .sF54B, html code.shiki .sF54B{--shiki-light:#39ADB5;--shiki-default:#E1E4E8;--shiki-dark:#89DDFF}html pre.shiki code .s6g6u, html code.shiki .s6g6u{--shiki-light:#E53935;--shiki-default:#85E89D;--shiki-dark:#F07178}html pre.shiki code .sXjFp, html code.shiki .sXjFp{--shiki-light:#9C3EDA;--shiki-default:#B392F0;--shiki-dark:#C792EA}html pre.shiki code .s0jeK, html code.shiki .s0jeK{--shiki-light:#39ADB5;--shiki-default:#9ECBFF;--shiki-dark:#89DDFF}html pre.shiki code .s-Aze, html code.shiki .s-Aze{--shiki-light:#91B859;--shiki-default:#9ECBFF;--shiki-dark:#C3E88D}html pre.shiki code .sV7Px, html code.shiki .sV7Px{--shiki-light:#9C3EDA;--shiki-default:#F97583;--shiki-dark:#C792EA}html pre.shiki code .sJTDI, html code.shiki .sJTDI{--shiki-light:#90A4AE;--shiki-default:#79B8FF;--shiki-dark:#BABED8}html pre.shiki code .sXPRQ, html code.shiki .sXPRQ{--shiki-light:#39ADB5;--shiki-default:#F97583;--shiki-dark:#89DDFF}html pre.shiki code .srJn9, html code.shiki .srJn9{--shiki-light:#6182B8;--shiki-default:#B392F0;--shiki-dark:#82AAFF}html pre.shiki code .smVNa, html code.shiki .smVNa{--shiki-light:#90A4AE;--shiki-default:#E1E4E8;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .ssIVr, html code.shiki .ssIVr{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#FFAB70;--shiki-default-font-style:inherit;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sZqJ9, html code.shiki .sZqJ9{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .szyBz, html code.shiki .szyBz{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#F97583;--shiki-default-font-style:inherit;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sOtFm, html code.shiki .sOtFm{--shiki-light:#E53935;--shiki-default:#E1E4E8;--shiki-dark:#F07178}html pre.shiki code .sOUxV, html code.shiki .sOUxV{--shiki-light:#F76D47;--shiki-default:#79B8FF;--shiki-dark:#F78C6C}html pre.shiki code .s5Y2e, html code.shiki .s5Y2e{--shiki-light:#90A4AE;--shiki-default:#B392F0;--shiki-dark:#BABED8}html pre.shiki code .seQRr, html code.shiki .seQRr{--shiki-light:#E2931D;--shiki-default:#79B8FF;--shiki-dark:#FFCB6B}html pre.shiki code .sJK67, html code.shiki .sJK67{--shiki-light:#E2931D;--shiki-default:#B392F0;--shiki-dark:#FFCB6B}html pre.shiki code .syA7L, html code.shiki .syA7L{--shiki-light:#E53935;--shiki-default:#B392F0;--shiki-dark:#F07178}html pre.shiki code .s0q4w, html code.shiki .s0q4w{--shiki-light:#39ADB5;--shiki-default:#79B8FF;--shiki-dark:#89DDFF}",{"title":354,"searchDepth":1114,"depth":1114,"links":3082},[3083,3088,3104],{"id":1142,"depth":1091,"text":1142,"children":3084},[3085,3086,3087],{"id":1146,"depth":1114,"text":1149},{"id":1304,"depth":1114,"text":1307},{"id":1489,"depth":1114,"text":1492},{"id":1529,"depth":1091,"text":1529,"children":3089},[3090,3091,3092,3096,3097],{"id":1538,"depth":1114,"text":1541},{"id":1616,"depth":1114,"text":1038},{"id":1042,"depth":1114,"text":1042,"children":3093},[3094],{"id":2053,"depth":1255,"text":3095},"自定义 Reducer\u002FReviver v3.4",{"id":2261,"depth":1114,"text":2264},{"id":2411,"depth":1114,"text":2414,"children":3098},[3099,3100,3101,3102,3103],{"id":2608,"depth":1255,"text":2608},{"id":2660,"depth":1255,"text":2660},{"id":2856,"depth":1255,"text":2856},{"id":2918,"depth":1255,"text":2918},{"id":2933,"depth":1255,"text":2933},{"id":2965,"depth":1091,"text":3105},"tryUseNuxtApp v3.10","md",{"links":3108},[3109],{"label":3110,"icon":3111,"to":3112,"size":2061},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002Fnuxt\u002Fnuxt\u002Fblob\u002Fmain\u002Fpackages\u002Fnuxt\u002Fsrc\u002Fapp\u002Fnuxt.ts",null,{"title":485,"description":486},"docs\u002F4.api\u002F2.composables\u002Fuse-nuxt-app","RbjgE6nicp8yiX1mnqP_Tyt6GesQ9U8WlzbIghVCTW0",1785179851006]