[{"data":1,"prerenderedAt":5502},["ShallowReactive",2],{"docs-all-flat":3,"docs-\u002Fdocs\u002Fgetting-started\u002Ftransitions":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":38,"body":1020,"description":39,"extension":5496,"meta":5497,"navigation":5498,"path":37,"seo":5499,"stem":5500,"__hash__":5501},"docs\u002Fdocs\u002F1.getting-started\u002F09.transitions.md",{"type":1021,"value":1022,"toc":5482},"minimark",[1023,1041,1059,1064,1071,1177,1187,1195,1551,1554,1566,1578,1817,1820,1827,1831,1837,1906,1913,2529,2531,2538,2550,2639,2643,2650,2674,2799,2808,2817,2909,2913,2920,2989,2995,3050,3054,3057,3066,3242,3257,3261,3271,4135,4143,4150,4154,4168,4262,4270,4274,4291,4300,4307,4355,4368,4379,4385,4435,4449,4507,4515,4528,4536,4555,4560,4639,4645,4789,4805,4973,4976,5189,5209,5232,5332,5344,5464,5468,5479],[1024,1025,1026],"note",{},[1027,1028,1029,1030,1040],"p",{},"Nuxt 利用 Vue 的 ",[1031,1032,1036],"a",{"href":1033,"rel":1034},"https:\u002F\u002Fvuejs.org\u002Fguide\u002Fbuilt-ins\u002Ftransition#the-transition-component",[1035],"nofollow",[1037,1038,1039],"code",{},"\u003CTransition>"," 组件来在页面和布局之间应用过渡效果。",[1042,1043,1044],"important",{},[1027,1045,1046,1047,1049,1050,1054,1055,1058],{},"由于 Nuxt 使用 Vue 的 ",[1037,1048,1039],{}," 组件，你想要添加动画的页面或布局必须只有一个",[1051,1052,1053],"strong",{},"根元素","。拥有多个根元素（fragment）的页面或布局无法被添加动画，因此过渡不会运行，并且在路由之间导航时可能会报错。Nuxt 会在开发环境下对此发出警告。请将模板包裹在单一根元素中（例如一个 ",[1037,1056,1057],{},"\u003Cdiv>","）。",[1060,1061,1063],"h2",{"id":1062},"页面过渡page-transitions","页面过渡（Page Transitions）",[1027,1065,1066,1067,1070],{},"你可以启用页面过渡，为所有 ",[1031,1068,1069],{"href":105},"页面"," 应用自动过渡。",[1072,1073,1078],"pre",{"className":1074,"code":1075,"filename":174,"language":1076,"meta":1077,"style":354},"language-ts shiki shiki-themes material-theme-lighter github-dark material-theme-palenight","export default defineNuxtConfig({\n app: {\n pageTransition: { name: 'page', mode: 'out-in' },\n },\n})\n","ts","twoslash",[1037,1079,1080,1104,1117,1162,1168],{"__ignoreMap":354},[1081,1082,1085,1089,1092,1096,1100],"span",{"class":1083,"line":1084},"line",1,[1081,1086,1088],{"class":1087},"szyBz","export",[1081,1090,1091],{"class":1087}," default",[1081,1093,1095],{"class":1094},"srJn9"," defineNuxtConfig",[1081,1097,1099],{"class":1098},"smVNa","(",[1081,1101,1103],{"class":1102},"sF54B","{\n",[1081,1105,1107,1111,1114],{"class":1083,"line":1106},2,[1081,1108,1110],{"class":1109},"sOtFm"," app",[1081,1112,1113],{"class":1102},":",[1081,1115,1116],{"class":1102}," {\n",[1081,1118,1120,1123,1125,1128,1131,1133,1137,1141,1144,1147,1150,1152,1154,1157,1159],{"class":1083,"line":1119},3,[1081,1121,1122],{"class":1109}," pageTransition",[1081,1124,1113],{"class":1102},[1081,1126,1127],{"class":1102}," {",[1081,1129,1130],{"class":1109}," name",[1081,1132,1113],{"class":1102},[1081,1134,1136],{"class":1135},"s0jeK"," '",[1081,1138,1140],{"class":1139},"s-Aze","page",[1081,1142,1143],{"class":1135},"'",[1081,1145,1146],{"class":1102},",",[1081,1148,1149],{"class":1109}," mode",[1081,1151,1113],{"class":1102},[1081,1153,1136],{"class":1135},[1081,1155,1156],{"class":1139},"out-in",[1081,1158,1143],{"class":1135},[1081,1160,1161],{"class":1102}," },\n",[1081,1163,1165],{"class":1083,"line":1164},4,[1081,1166,1167],{"class":1102}," },\n",[1081,1169,1171,1174],{"class":1083,"line":1170},5,[1081,1172,1173],{"class":1102},"}",[1081,1175,1176],{"class":1098},")\n",[1024,1178,1179],{},[1027,1180,1181,1182,1186],{},"如果你同时更改了布局和页面，这里设置的页面过渡将不会运行。相反，你应该设置一个 ",[1031,1183,1185],{"href":1184},"\u002Fdocs\u002Fgetting-started\u002Ftransitions#layout-transitions","布局过渡","。",[1027,1188,1189,1190,1194],{},"要开始在你的页面之间添加过渡，请将以下 CSS 添加到你的 ",[1031,1191,1192],{"href":117},[1037,1193,118],{},"：",[1196,1197,1198,1377,1470],"code-group",{},[1072,1199,1204],{"className":1200,"code":1201,"filename":1202,"language":1203,"meta":354,"style":354},"language-vue shiki shiki-themes material-theme-lighter github-dark material-theme-palenight","\u003Ctemplate>\n \u003CNuxtPage \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cstyle>\n.page-enter-active,\n.page-leave-active {\n transition: all 0.4s;\n}\n.page-enter-from,\n.page-leave-to {\n opacity: 0;\n filter: blur(1rem);\n}\n\u003C\u002Fstyle>\n","app\u002Fapp.vue","vue",[1037,1205,1206,1218,1229,1238,1244,1253,1267,1277,1301,1307,1317,1327,1340,1363,1368],{"__ignoreMap":354},[1081,1207,1208,1211,1215],{"class":1083,"line":1084},[1081,1209,1210],{"class":1102},"\u003C",[1081,1212,1214],{"class":1213},"s6g6u","template",[1081,1216,1217],{"class":1102},">\n",[1081,1219,1220,1223,1226],{"class":1083,"line":1106},[1081,1221,1222],{"class":1102}," \u003C",[1081,1224,1225],{"class":1213},"NuxtPage",[1081,1227,1228],{"class":1102}," \u002F>\n",[1081,1230,1231,1234,1236],{"class":1083,"line":1119},[1081,1232,1233],{"class":1102},"\u003C\u002F",[1081,1235,1214],{"class":1213},[1081,1237,1217],{"class":1102},[1081,1239,1240],{"class":1083,"line":1164},[1081,1241,1243],{"emptyLinePlaceholder":1242},true,"\n",[1081,1245,1246,1248,1251],{"class":1083,"line":1170},[1081,1247,1210],{"class":1102},[1081,1249,1250],{"class":1213},"style",[1081,1252,1217],{"class":1102},[1081,1254,1256,1260,1264],{"class":1083,"line":1255},6,[1081,1257,1259],{"class":1258},"szLpQ",".",[1081,1261,1263],{"class":1262},"sJK67","page-enter-active",[1081,1265,1266],{"class":1102},",\n",[1081,1268,1270,1272,1275],{"class":1083,"line":1269},7,[1081,1271,1259],{"class":1258},[1081,1273,1274],{"class":1262},"page-leave-active",[1081,1276,1116],{"class":1102},[1081,1278,1280,1284,1286,1290,1294,1298],{"class":1083,"line":1279},8,[1081,1281,1283],{"class":1282},"sETrE"," transition",[1081,1285,1113],{"class":1102},[1081,1287,1289],{"class":1288},"sJTDI"," all",[1081,1291,1293],{"class":1292},"sOUxV"," 0.4",[1081,1295,1297],{"class":1296},"sZr3Q","s",[1081,1299,1300],{"class":1102},";\n",[1081,1302,1304],{"class":1083,"line":1303},9,[1081,1305,1306],{"class":1102},"}\n",[1081,1308,1310,1312,1315],{"class":1083,"line":1309},10,[1081,1311,1259],{"class":1258},[1081,1313,1314],{"class":1262},"page-enter-from",[1081,1316,1266],{"class":1102},[1081,1318,1320,1322,1325],{"class":1083,"line":1319},11,[1081,1321,1259],{"class":1258},[1081,1323,1324],{"class":1262},"page-leave-to",[1081,1326,1116],{"class":1102},[1081,1328,1330,1333,1335,1338],{"class":1083,"line":1329},12,[1081,1331,1332],{"class":1282}," opacity",[1081,1334,1113],{"class":1102},[1081,1336,1337],{"class":1292}," 0",[1081,1339,1300],{"class":1102},[1081,1341,1343,1346,1348,1352,1354,1357,1360],{"class":1083,"line":1342},13,[1081,1344,1345],{"class":1282}," filter",[1081,1347,1113],{"class":1102},[1081,1349,1351],{"class":1350},"scsZY"," blur",[1081,1353,1099],{"class":1102},[1081,1355,1356],{"class":1292},"1",[1081,1358,1359],{"class":1296},"rem",[1081,1361,1362],{"class":1102},");\n",[1081,1364,1366],{"class":1083,"line":1365},14,[1081,1367,1306],{"class":1102},[1081,1369,1371,1373,1375],{"class":1083,"line":1370},15,[1081,1372,1233],{"class":1102},[1081,1374,1250],{"class":1213},[1081,1376,1217],{"class":1102},[1072,1378,1381],{"className":1200,"code":1379,"filename":1380,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003Cdiv>\n \u003Ch1>Home page\u003C\u002Fh1>\n \u003CNuxtLink to=\"\u002Fabout\">About page\u003C\u002FNuxtLink>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","app\u002Fpages\u002Findex.vue",[1037,1382,1383,1391,1400,1420,1453,1462],{"__ignoreMap":354},[1081,1384,1385,1387,1389],{"class":1083,"line":1084},[1081,1386,1210],{"class":1102},[1081,1388,1214],{"class":1213},[1081,1390,1217],{"class":1102},[1081,1392,1393,1395,1398],{"class":1083,"line":1106},[1081,1394,1222],{"class":1102},[1081,1396,1397],{"class":1213},"div",[1081,1399,1217],{"class":1102},[1081,1401,1402,1405,1408,1411,1414,1416,1418],{"class":1083,"line":1119},[1081,1403,1404],{"class":1102}," \u003C",[1081,1406,1407],{"class":1213},"h1",[1081,1409,1410],{"class":1102},">",[1081,1412,1413],{"class":1098},"Home page",[1081,1415,1233],{"class":1102},[1081,1417,1407],{"class":1213},[1081,1419,1217],{"class":1102},[1081,1421,1422,1424,1427,1431,1434,1437,1440,1442,1444,1447,1449,1451],{"class":1083,"line":1164},[1081,1423,1404],{"class":1102},[1081,1425,1426],{"class":1213},"NuxtLink",[1081,1428,1430],{"class":1429},"sXjFp"," to",[1081,1432,1433],{"class":1102},"=",[1081,1435,1436],{"class":1135},"\"",[1081,1438,1439],{"class":1139},"\u002Fabout",[1081,1441,1436],{"class":1135},[1081,1443,1410],{"class":1102},[1081,1445,1446],{"class":1098},"About page",[1081,1448,1233],{"class":1102},[1081,1450,1426],{"class":1213},[1081,1452,1217],{"class":1102},[1081,1454,1455,1458,1460],{"class":1083,"line":1170},[1081,1456,1457],{"class":1102}," \u003C\u002F",[1081,1459,1397],{"class":1213},[1081,1461,1217],{"class":1102},[1081,1463,1464,1466,1468],{"class":1083,"line":1255},[1081,1465,1233],{"class":1102},[1081,1467,1214],{"class":1213},[1081,1469,1217],{"class":1102},[1072,1471,1474],{"className":1200,"code":1472,"filename":1473,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003Cdiv>\n \u003Ch1>About page\u003C\u002Fh1>\n \u003CNuxtLink to=\"\u002F\">Home page\u003C\u002FNuxtLink>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","app\u002Fpages\u002Fabout.vue",[1037,1475,1476,1484,1492,1508,1535,1543],{"__ignoreMap":354},[1081,1477,1478,1480,1482],{"class":1083,"line":1084},[1081,1479,1210],{"class":1102},[1081,1481,1214],{"class":1213},[1081,1483,1217],{"class":1102},[1081,1485,1486,1488,1490],{"class":1083,"line":1106},[1081,1487,1222],{"class":1102},[1081,1489,1397],{"class":1213},[1081,1491,1217],{"class":1102},[1081,1493,1494,1496,1498,1500,1502,1504,1506],{"class":1083,"line":1119},[1081,1495,1404],{"class":1102},[1081,1497,1407],{"class":1213},[1081,1499,1410],{"class":1102},[1081,1501,1446],{"class":1098},[1081,1503,1233],{"class":1102},[1081,1505,1407],{"class":1213},[1081,1507,1217],{"class":1102},[1081,1509,1510,1512,1514,1516,1518,1520,1523,1525,1527,1529,1531,1533],{"class":1083,"line":1164},[1081,1511,1404],{"class":1102},[1081,1513,1426],{"class":1213},[1081,1515,1430],{"class":1429},[1081,1517,1433],{"class":1102},[1081,1519,1436],{"class":1135},[1081,1521,1522],{"class":1139},"\u002F",[1081,1524,1436],{"class":1135},[1081,1526,1410],{"class":1102},[1081,1528,1413],{"class":1098},[1081,1530,1233],{"class":1102},[1081,1532,1426],{"class":1213},[1081,1534,1217],{"class":1102},[1081,1536,1537,1539,1541],{"class":1083,"line":1170},[1081,1538,1457],{"class":1102},[1081,1540,1397],{"class":1213},[1081,1542,1217],{"class":1102},[1081,1544,1545,1547,1549],{"class":1083,"line":1255},[1081,1546,1233],{"class":1102},[1081,1548,1214],{"class":1213},[1081,1550,1217],{"class":1102},[1027,1552,1553],{},"在页面之间导航时，会产生以下结果：",[1555,1556,1560,1561],"video",{"controls":1242,"className":1557,"poster":1559},[1558],"rounded","https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665061349\u002Fnuxt3\u002Fnuxt3-page-transitions_umwvmh.jpg","\n ",[1562,1563],"source",{"src":1564,"type":1565},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665061349\u002Fnuxt3\u002Fnuxt3-page-transitions_umwvmh.mp4","video\u002Fmp4",[1027,1567,1568,1569,1573,1574,1577],{},"要为某个页面设置不同的过渡，请在该页面的 ",[1031,1570,1571],{"href":600},[1037,1572,601],{}," 中设置 ",[1037,1575,1576],{},"pageTransition"," 键：",[1196,1579,1580,1660],{},[1072,1581,1584],{"className":1200,"code":1582,"filename":1583,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n pageTransition: {\n name: 'rotate',\n },\n})\n\u003C\u002Fscript>\n","pages\u002Fabout.vue",[1037,1585,1586,1609,1617,1626,1642,1646,1652],{"__ignoreMap":354},[1081,1587,1588,1590,1593,1596,1599,1601,1603,1605,1607],{"class":1083,"line":1084},[1081,1589,1210],{"class":1102},[1081,1591,1592],{"class":1213},"script",[1081,1594,1595],{"class":1429}," setup",[1081,1597,1598],{"class":1429}," lang",[1081,1600,1433],{"class":1102},[1081,1602,1436],{"class":1135},[1081,1604,1076],{"class":1139},[1081,1606,1436],{"class":1135},[1081,1608,1217],{"class":1102},[1081,1610,1611,1613,1615],{"class":1083,"line":1106},[1081,1612,601],{"class":1094},[1081,1614,1099],{"class":1098},[1081,1616,1103],{"class":1102},[1081,1618,1619,1622,1624],{"class":1083,"line":1119},[1081,1620,1621],{"class":1109}," pageTransition",[1081,1623,1113],{"class":1102},[1081,1625,1116],{"class":1102},[1081,1627,1628,1631,1633,1635,1638,1640],{"class":1083,"line":1164},[1081,1629,1630],{"class":1109}," name",[1081,1632,1113],{"class":1102},[1081,1634,1136],{"class":1135},[1081,1636,1637],{"class":1139},"rotate",[1081,1639,1143],{"class":1135},[1081,1641,1266],{"class":1102},[1081,1643,1644],{"class":1083,"line":1170},[1081,1645,1167],{"class":1102},[1081,1647,1648,1650],{"class":1083,"line":1255},[1081,1649,1173],{"class":1102},[1081,1651,1176],{"class":1098},[1081,1653,1654,1656,1658],{"class":1083,"line":1269},[1081,1655,1233],{"class":1102},[1081,1657,1592],{"class":1213},[1081,1659,1217],{"class":1102},[1072,1661,1663],{"className":1200,"code":1662,"filename":1202,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003CNuxtPage \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cstyle>\n\u002F* ... *\u002F\n.rotate-enter-active,\n.rotate-leave-active {\n transition: all 0.4s;\n}\n.rotate-enter-from,\n.rotate-leave-to {\n opacity: 0;\n transform: rotate3d(1, 1, 1, 15deg);\n}\n\u003C\u002Fstyle>\n",[1037,1664,1665,1673,1681,1689,1693,1701,1707,1716,1725,1739,1743,1752,1761,1771,1804,1808],{"__ignoreMap":354},[1081,1666,1667,1669,1671],{"class":1083,"line":1084},[1081,1668,1210],{"class":1102},[1081,1670,1214],{"class":1213},[1081,1672,1217],{"class":1102},[1081,1674,1675,1677,1679],{"class":1083,"line":1106},[1081,1676,1222],{"class":1102},[1081,1678,1225],{"class":1213},[1081,1680,1228],{"class":1102},[1081,1682,1683,1685,1687],{"class":1083,"line":1119},[1081,1684,1233],{"class":1102},[1081,1686,1214],{"class":1213},[1081,1688,1217],{"class":1102},[1081,1690,1691],{"class":1083,"line":1164},[1081,1692,1243],{"emptyLinePlaceholder":1242},[1081,1694,1695,1697,1699],{"class":1083,"line":1170},[1081,1696,1210],{"class":1102},[1081,1698,1250],{"class":1213},[1081,1700,1217],{"class":1102},[1081,1702,1703],{"class":1083,"line":1255},[1081,1704,1706],{"class":1705},"sZqJ9","\u002F* ... *\u002F\n",[1081,1708,1709,1711,1714],{"class":1083,"line":1269},[1081,1710,1259],{"class":1258},[1081,1712,1713],{"class":1262},"rotate-enter-active",[1081,1715,1266],{"class":1102},[1081,1717,1718,1720,1723],{"class":1083,"line":1279},[1081,1719,1259],{"class":1258},[1081,1721,1722],{"class":1262},"rotate-leave-active",[1081,1724,1116],{"class":1102},[1081,1726,1727,1729,1731,1733,1735,1737],{"class":1083,"line":1303},[1081,1728,1283],{"class":1282},[1081,1730,1113],{"class":1102},[1081,1732,1289],{"class":1288},[1081,1734,1293],{"class":1292},[1081,1736,1297],{"class":1296},[1081,1738,1300],{"class":1102},[1081,1740,1741],{"class":1083,"line":1309},[1081,1742,1306],{"class":1102},[1081,1744,1745,1747,1750],{"class":1083,"line":1319},[1081,1746,1259],{"class":1258},[1081,1748,1749],{"class":1262},"rotate-enter-from",[1081,1751,1266],{"class":1102},[1081,1753,1754,1756,1759],{"class":1083,"line":1329},[1081,1755,1259],{"class":1258},[1081,1757,1758],{"class":1262},"rotate-leave-to",[1081,1760,1116],{"class":1102},[1081,1762,1763,1765,1767,1769],{"class":1083,"line":1342},[1081,1764,1332],{"class":1282},[1081,1766,1113],{"class":1102},[1081,1768,1337],{"class":1292},[1081,1770,1300],{"class":1102},[1081,1772,1773,1776,1778,1781,1783,1785,1787,1790,1792,1794,1796,1799,1802],{"class":1083,"line":1365},[1081,1774,1775],{"class":1282}," transform",[1081,1777,1113],{"class":1102},[1081,1779,1780],{"class":1350}," rotate3d",[1081,1782,1099],{"class":1102},[1081,1784,1356],{"class":1292},[1081,1786,1146],{"class":1102},[1081,1788,1789],{"class":1292}," 1",[1081,1791,1146],{"class":1102},[1081,1793,1789],{"class":1292},[1081,1795,1146],{"class":1102},[1081,1797,1798],{"class":1292}," 15",[1081,1800,1801],{"class":1296},"deg",[1081,1803,1362],{"class":1102},[1081,1805,1806],{"class":1083,"line":1370},[1081,1807,1306],{"class":1102},[1081,1809,1811,1813,1815],{"class":1083,"line":1810},16,[1081,1812,1233],{"class":1102},[1081,1814,1250],{"class":1213},[1081,1816,1217],{"class":1102},[1027,1818,1819],{},"切换到 about 页面时会添加 3D 旋转效果：",[1555,1821,1560,1824],{"controls":1242,"className":1822,"poster":1823},[1558],"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665063233\u002Fnuxt3\u002Fnuxt3-page-transitions-cutom.jpg",[1562,1825],{"src":1826,"type":1565},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665063233\u002Fnuxt3\u002Fnuxt3-page-transitions-cutom.mp4",[1060,1828,1830],{"id":1829},"布局过渡layout-transitions","布局过渡（Layout Transitions）",[1027,1832,1833,1834,1070],{},"你可以启用布局过渡，为所有 ",[1031,1835,1836],{"href":97},"布局",[1072,1838,1840],{"className":1074,"code":1839,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n app: {\n layoutTransition: { name: 'layout', mode: 'out-in' },\n },\n})\n",[1037,1841,1842,1854,1862,1896,1900],{"__ignoreMap":354},[1081,1843,1844,1846,1848,1850,1852],{"class":1083,"line":1084},[1081,1845,1088],{"class":1087},[1081,1847,1091],{"class":1087},[1081,1849,1095],{"class":1094},[1081,1851,1099],{"class":1098},[1081,1853,1103],{"class":1102},[1081,1855,1856,1858,1860],{"class":1083,"line":1106},[1081,1857,1110],{"class":1109},[1081,1859,1113],{"class":1102},[1081,1861,1116],{"class":1102},[1081,1863,1864,1867,1869,1871,1873,1875,1877,1880,1882,1884,1886,1888,1890,1892,1894],{"class":1083,"line":1119},[1081,1865,1866],{"class":1109}," layoutTransition",[1081,1868,1113],{"class":1102},[1081,1870,1127],{"class":1102},[1081,1872,1130],{"class":1109},[1081,1874,1113],{"class":1102},[1081,1876,1136],{"class":1135},[1081,1878,1879],{"class":1139},"layout",[1081,1881,1143],{"class":1135},[1081,1883,1146],{"class":1102},[1081,1885,1149],{"class":1109},[1081,1887,1113],{"class":1102},[1081,1889,1136],{"class":1135},[1081,1891,1156],{"class":1139},[1081,1893,1143],{"class":1135},[1081,1895,1161],{"class":1102},[1081,1897,1898],{"class":1083,"line":1164},[1081,1899,1167],{"class":1102},[1081,1901,1902,1904],{"class":1083,"line":1170},[1081,1903,1173],{"class":1102},[1081,1905,1176],{"class":1098},[1027,1907,1908,1909,1194],{},"要开始在你的页面和布局之间添加过渡，请将以下 CSS 添加到你的 ",[1031,1910,1911],{"href":117},[1037,1912,118],{},[1196,1914,1915,2054,2168,2310,2388],{},[1072,1916,1918],{"className":1200,"code":1917,"filename":1202,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003CNuxtLayout>\n \u003CNuxtPage \u002F>\n \u003C\u002FNuxtLayout>\n\u003C\u002Ftemplate>\n\n\u003Cstyle>\n.layout-enter-active,\n.layout-leave-active {\n transition: all 0.4s;\n}\n.layout-enter-from,\n.layout-leave-to {\n filter: grayscale(1);\n}\n\u003C\u002Fstyle>\n",[1037,1919,1920,1928,1937,1945,1953,1961,1965,1973,1982,1991,2005,2009,2018,2027,2042,2046],{"__ignoreMap":354},[1081,1921,1922,1924,1926],{"class":1083,"line":1084},[1081,1923,1210],{"class":1102},[1081,1925,1214],{"class":1213},[1081,1927,1217],{"class":1102},[1081,1929,1930,1932,1935],{"class":1083,"line":1106},[1081,1931,1222],{"class":1102},[1081,1933,1934],{"class":1213},"NuxtLayout",[1081,1936,1217],{"class":1102},[1081,1938,1939,1941,1943],{"class":1083,"line":1119},[1081,1940,1404],{"class":1102},[1081,1942,1225],{"class":1213},[1081,1944,1228],{"class":1102},[1081,1946,1947,1949,1951],{"class":1083,"line":1164},[1081,1948,1457],{"class":1102},[1081,1950,1934],{"class":1213},[1081,1952,1217],{"class":1102},[1081,1954,1955,1957,1959],{"class":1083,"line":1170},[1081,1956,1233],{"class":1102},[1081,1958,1214],{"class":1213},[1081,1960,1217],{"class":1102},[1081,1962,1963],{"class":1083,"line":1255},[1081,1964,1243],{"emptyLinePlaceholder":1242},[1081,1966,1967,1969,1971],{"class":1083,"line":1269},[1081,1968,1210],{"class":1102},[1081,1970,1250],{"class":1213},[1081,1972,1217],{"class":1102},[1081,1974,1975,1977,1980],{"class":1083,"line":1279},[1081,1976,1259],{"class":1258},[1081,1978,1979],{"class":1262},"layout-enter-active",[1081,1981,1266],{"class":1102},[1081,1983,1984,1986,1989],{"class":1083,"line":1303},[1081,1985,1259],{"class":1258},[1081,1987,1988],{"class":1262},"layout-leave-active",[1081,1990,1116],{"class":1102},[1081,1992,1993,1995,1997,1999,2001,2003],{"class":1083,"line":1309},[1081,1994,1283],{"class":1282},[1081,1996,1113],{"class":1102},[1081,1998,1289],{"class":1288},[1081,2000,1293],{"class":1292},[1081,2002,1297],{"class":1296},[1081,2004,1300],{"class":1102},[1081,2006,2007],{"class":1083,"line":1319},[1081,2008,1306],{"class":1102},[1081,2010,2011,2013,2016],{"class":1083,"line":1329},[1081,2012,1259],{"class":1258},[1081,2014,2015],{"class":1262},"layout-enter-from",[1081,2017,1266],{"class":1102},[1081,2019,2020,2022,2025],{"class":1083,"line":1342},[1081,2021,1259],{"class":1258},[1081,2023,2024],{"class":1262},"layout-leave-to",[1081,2026,1116],{"class":1102},[1081,2028,2029,2031,2033,2036,2038,2040],{"class":1083,"line":1365},[1081,2030,1345],{"class":1282},[1081,2032,1113],{"class":1102},[1081,2034,2035],{"class":1350}," grayscale",[1081,2037,1099],{"class":1102},[1081,2039,1356],{"class":1292},[1081,2041,1362],{"class":1102},[1081,2043,2044],{"class":1083,"line":1370},[1081,2045,1306],{"class":1102},[1081,2047,2048,2050,2052],{"class":1083,"line":1810},[1081,2049,1233],{"class":1102},[1081,2051,1250],{"class":1213},[1081,2053,1217],{"class":1102},[1072,2055,2058],{"className":1200,"code":2056,"filename":2057,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003Cdiv>\n \u003Cpre>default layout\u003C\u002Fpre>\n \u003Cslot \u002F>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cstyle scoped>\ndiv {\n background-color: lightgreen;\n}\n\u003C\u002Fstyle>\n","app\u002Flayouts\u002Fdefault.vue",[1037,2059,2060,2068,2076,2093,2106,2114,2122,2126,2137,2144,2156,2160],{"__ignoreMap":354},[1081,2061,2062,2064,2066],{"class":1083,"line":1084},[1081,2063,1210],{"class":1102},[1081,2065,1214],{"class":1213},[1081,2067,1217],{"class":1102},[1081,2069,2070,2072,2074],{"class":1083,"line":1106},[1081,2071,1222],{"class":1102},[1081,2073,1397],{"class":1213},[1081,2075,1217],{"class":1102},[1081,2077,2078,2080,2082,2084,2087,2089,2091],{"class":1083,"line":1119},[1081,2079,1404],{"class":1102},[1081,2081,1072],{"class":1213},[1081,2083,1410],{"class":1102},[1081,2085,2086],{"class":1098},"default layout",[1081,2088,1233],{"class":1102},[1081,2090,1072],{"class":1213},[1081,2092,1217],{"class":1102},[1081,2094,2095,2097,2100,2104],{"class":1083,"line":1164},[1081,2096,1404],{"class":1102},[1081,2098,2099],{"class":1213},"slot",[1081,2101,2103],{"class":2102},"sMKz0"," \u002F",[1081,2105,1217],{"class":1102},[1081,2107,2108,2110,2112],{"class":1083,"line":1170},[1081,2109,1457],{"class":1102},[1081,2111,1397],{"class":1213},[1081,2113,1217],{"class":1102},[1081,2115,2116,2118,2120],{"class":1083,"line":1255},[1081,2117,1233],{"class":1102},[1081,2119,1214],{"class":1213},[1081,2121,1217],{"class":1102},[1081,2123,2124],{"class":1083,"line":1269},[1081,2125,1243],{"emptyLinePlaceholder":1242},[1081,2127,2128,2130,2132,2135],{"class":1083,"line":1279},[1081,2129,1210],{"class":1102},[1081,2131,1250],{"class":1213},[1081,2133,2134],{"class":1429}," scoped",[1081,2136,1217],{"class":1102},[1081,2138,2139,2142],{"class":1083,"line":1303},[1081,2140,1397],{"class":2141},"sv6Pl",[1081,2143,1116],{"class":1102},[1081,2145,2146,2149,2151,2154],{"class":1083,"line":1309},[1081,2147,2148],{"class":1282}," background-color",[1081,2150,1113],{"class":1102},[1081,2152,2153],{"class":1288}," lightgreen",[1081,2155,1300],{"class":1102},[1081,2157,2158],{"class":1083,"line":1319},[1081,2159,1306],{"class":1102},[1081,2161,2162,2164,2166],{"class":1083,"line":1329},[1081,2163,1233],{"class":1102},[1081,2165,1250],{"class":1213},[1081,2167,1217],{"class":1102},[1072,2169,2172],{"className":1200,"code":2170,"filename":2171,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003Cdiv>\n \u003Cpre>orange layout\u003C\u002Fpre>\n \u003Cslot \u002F>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cstyle scoped>\ndiv {\n background-color: #eebb90;\n padding: 20px;\n height: 100vh;\n}\n\u003C\u002Fstyle>\n","app\u002Flayouts\u002Forange.vue",[1037,2173,2174,2182,2190,2207,2217,2225,2233,2237,2247,2253,2268,2283,2298,2302],{"__ignoreMap":354},[1081,2175,2176,2178,2180],{"class":1083,"line":1084},[1081,2177,1210],{"class":1102},[1081,2179,1214],{"class":1213},[1081,2181,1217],{"class":1102},[1081,2183,2184,2186,2188],{"class":1083,"line":1106},[1081,2185,1222],{"class":1102},[1081,2187,1397],{"class":1213},[1081,2189,1217],{"class":1102},[1081,2191,2192,2194,2196,2198,2201,2203,2205],{"class":1083,"line":1119},[1081,2193,1404],{"class":1102},[1081,2195,1072],{"class":1213},[1081,2197,1410],{"class":1102},[1081,2199,2200],{"class":1098},"orange layout",[1081,2202,1233],{"class":1102},[1081,2204,1072],{"class":1213},[1081,2206,1217],{"class":1102},[1081,2208,2209,2211,2213,2215],{"class":1083,"line":1164},[1081,2210,1404],{"class":1102},[1081,2212,2099],{"class":1213},[1081,2214,2103],{"class":2102},[1081,2216,1217],{"class":1102},[1081,2218,2219,2221,2223],{"class":1083,"line":1170},[1081,2220,1457],{"class":1102},[1081,2222,1397],{"class":1213},[1081,2224,1217],{"class":1102},[1081,2226,2227,2229,2231],{"class":1083,"line":1255},[1081,2228,1233],{"class":1102},[1081,2230,1214],{"class":1213},[1081,2232,1217],{"class":1102},[1081,2234,2235],{"class":1083,"line":1269},[1081,2236,1243],{"emptyLinePlaceholder":1242},[1081,2238,2239,2241,2243,2245],{"class":1083,"line":1279},[1081,2240,1210],{"class":1102},[1081,2242,1250],{"class":1213},[1081,2244,2134],{"class":1429},[1081,2246,1217],{"class":1102},[1081,2248,2249,2251],{"class":1083,"line":1303},[1081,2250,1397],{"class":2141},[1081,2252,1116],{"class":1102},[1081,2254,2255,2257,2259,2263,2266],{"class":1083,"line":1309},[1081,2256,2148],{"class":1282},[1081,2258,1113],{"class":1102},[1081,2260,2262],{"class":2261},"s0q4w"," #",[1081,2264,2265],{"class":1288},"eebb90",[1081,2267,1300],{"class":1102},[1081,2269,2270,2273,2275,2278,2281],{"class":1083,"line":1319},[1081,2271,2272],{"class":1282}," padding",[1081,2274,1113],{"class":1102},[1081,2276,2277],{"class":1292}," 20",[1081,2279,2280],{"class":1296},"px",[1081,2282,1300],{"class":1102},[1081,2284,2285,2288,2290,2293,2296],{"class":1083,"line":1329},[1081,2286,2287],{"class":1282}," height",[1081,2289,1113],{"class":1102},[1081,2291,2292],{"class":1292}," 100",[1081,2294,2295],{"class":1296},"vh",[1081,2297,1300],{"class":1102},[1081,2299,2300],{"class":1083,"line":1342},[1081,2301,1306],{"class":1102},[1081,2303,2304,2306,2308],{"class":1083,"line":1365},[1081,2305,1233],{"class":1102},[1081,2307,1250],{"class":1213},[1081,2309,1217],{"class":1102},[1072,2311,2312],{"className":1200,"code":1379,"filename":1380,"language":1203,"meta":354,"style":354},[1037,2313,2314,2322,2330,2346,2372,2380],{"__ignoreMap":354},[1081,2315,2316,2318,2320],{"class":1083,"line":1084},[1081,2317,1210],{"class":1102},[1081,2319,1214],{"class":1213},[1081,2321,1217],{"class":1102},[1081,2323,2324,2326,2328],{"class":1083,"line":1106},[1081,2325,1222],{"class":1102},[1081,2327,1397],{"class":1213},[1081,2329,1217],{"class":1102},[1081,2331,2332,2334,2336,2338,2340,2342,2344],{"class":1083,"line":1119},[1081,2333,1404],{"class":1102},[1081,2335,1407],{"class":1213},[1081,2337,1410],{"class":1102},[1081,2339,1413],{"class":1098},[1081,2341,1233],{"class":1102},[1081,2343,1407],{"class":1213},[1081,2345,1217],{"class":1102},[1081,2347,2348,2350,2352,2354,2356,2358,2360,2362,2364,2366,2368,2370],{"class":1083,"line":1164},[1081,2349,1404],{"class":1102},[1081,2351,1426],{"class":1213},[1081,2353,1430],{"class":1429},[1081,2355,1433],{"class":1102},[1081,2357,1436],{"class":1135},[1081,2359,1439],{"class":1139},[1081,2361,1436],{"class":1135},[1081,2363,1410],{"class":1102},[1081,2365,1446],{"class":1098},[1081,2367,1233],{"class":1102},[1081,2369,1426],{"class":1213},[1081,2371,1217],{"class":1102},[1081,2373,2374,2376,2378],{"class":1083,"line":1170},[1081,2375,1457],{"class":1102},[1081,2377,1397],{"class":1213},[1081,2379,1217],{"class":1102},[1081,2381,2382,2384,2386],{"class":1083,"line":1255},[1081,2383,1233],{"class":1102},[1081,2385,1214],{"class":1213},[1081,2387,1217],{"class":1102},[1072,2389,2391],{"className":1200,"code":2390,"filename":1473,"language":1203,"meta":354,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n layout: 'orange',\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cdiv>\n \u003Ch1>About page\u003C\u002Fh1>\n \u003CNuxtLink to=\"\u002F\">Home page\u003C\u002FNuxtLink>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[1037,2392,2393,2413,2421,2437,2443,2451,2455,2463,2471,2487,2513,2521],{"__ignoreMap":354},[1081,2394,2395,2397,2399,2401,2403,2405,2407,2409,2411],{"class":1083,"line":1084},[1081,2396,1210],{"class":1102},[1081,2398,1592],{"class":1213},[1081,2400,1595],{"class":1429},[1081,2402,1598],{"class":1429},[1081,2404,1433],{"class":1102},[1081,2406,1436],{"class":1135},[1081,2408,1076],{"class":1139},[1081,2410,1436],{"class":1135},[1081,2412,1217],{"class":1102},[1081,2414,2415,2417,2419],{"class":1083,"line":1106},[1081,2416,601],{"class":1094},[1081,2418,1099],{"class":1098},[1081,2420,1103],{"class":1102},[1081,2422,2423,2426,2428,2430,2433,2435],{"class":1083,"line":1119},[1081,2424,2425],{"class":1109}," layout",[1081,2427,1113],{"class":1102},[1081,2429,1136],{"class":1135},[1081,2431,2432],{"class":1139},"orange",[1081,2434,1143],{"class":1135},[1081,2436,1266],{"class":1102},[1081,2438,2439,2441],{"class":1083,"line":1164},[1081,2440,1173],{"class":1102},[1081,2442,1176],{"class":1098},[1081,2444,2445,2447,2449],{"class":1083,"line":1170},[1081,2446,1233],{"class":1102},[1081,2448,1592],{"class":1213},[1081,2450,1217],{"class":1102},[1081,2452,2453],{"class":1083,"line":1255},[1081,2454,1243],{"emptyLinePlaceholder":1242},[1081,2456,2457,2459,2461],{"class":1083,"line":1269},[1081,2458,1210],{"class":1102},[1081,2460,1214],{"class":1213},[1081,2462,1217],{"class":1102},[1081,2464,2465,2467,2469],{"class":1083,"line":1279},[1081,2466,1222],{"class":1102},[1081,2468,1397],{"class":1213},[1081,2470,1217],{"class":1102},[1081,2472,2473,2475,2477,2479,2481,2483,2485],{"class":1083,"line":1303},[1081,2474,1404],{"class":1102},[1081,2476,1407],{"class":1213},[1081,2478,1410],{"class":1102},[1081,2480,1446],{"class":1098},[1081,2482,1233],{"class":1102},[1081,2484,1407],{"class":1213},[1081,2486,1217],{"class":1102},[1081,2488,2489,2491,2493,2495,2497,2499,2501,2503,2505,2507,2509,2511],{"class":1083,"line":1309},[1081,2490,1404],{"class":1102},[1081,2492,1426],{"class":1213},[1081,2494,1430],{"class":1429},[1081,2496,1433],{"class":1102},[1081,2498,1436],{"class":1135},[1081,2500,1522],{"class":1139},[1081,2502,1436],{"class":1135},[1081,2504,1410],{"class":1102},[1081,2506,1413],{"class":1098},[1081,2508,1233],{"class":1102},[1081,2510,1426],{"class":1213},[1081,2512,1217],{"class":1102},[1081,2514,2515,2517,2519],{"class":1083,"line":1319},[1081,2516,1457],{"class":1102},[1081,2518,1397],{"class":1213},[1081,2520,1217],{"class":1102},[1081,2522,2523,2525,2527],{"class":1083,"line":1329},[1081,2524,1233],{"class":1102},[1081,2526,1214],{"class":1213},[1081,2528,1217],{"class":1102},[1027,2530,1553],{},[1555,2532,1560,2535],{"controls":1242,"className":2533,"poster":2534},[1558],"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665065289\u002Fnuxt3\u002Fnuxt3-layouts-transitions_c9hwlx.jpg",[1562,2536],{"src":2537,"type":1565},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665065289\u002Fnuxt3\u002Fnuxt3-layouts-transitions_c9hwlx.mp4",[1027,2539,2540,2541,2543,2544,2546,2547,1194],{},"与 ",[1037,2542,1576],{}," 类似，你可以使用 ",[1037,2545,601],{}," 为页面组件应用自定义的 ",[1037,2548,2549],{},"layoutTransition",[1072,2551,2553],{"className":1200,"code":2552,"filename":1583,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n layout: 'orange',\n layoutTransition: {\n name: 'slide-in',\n },\n})\n\u003C\u002Fscript>\n",[1037,2554,2555,2575,2583,2597,2606,2621,2625,2631],{"__ignoreMap":354},[1081,2556,2557,2559,2561,2563,2565,2567,2569,2571,2573],{"class":1083,"line":1084},[1081,2558,1210],{"class":1102},[1081,2560,1592],{"class":1213},[1081,2562,1595],{"class":1429},[1081,2564,1598],{"class":1429},[1081,2566,1433],{"class":1102},[1081,2568,1436],{"class":1135},[1081,2570,1076],{"class":1139},[1081,2572,1436],{"class":1135},[1081,2574,1217],{"class":1102},[1081,2576,2577,2579,2581],{"class":1083,"line":1106},[1081,2578,601],{"class":1094},[1081,2580,1099],{"class":1098},[1081,2582,1103],{"class":1102},[1081,2584,2585,2587,2589,2591,2593,2595],{"class":1083,"line":1119},[1081,2586,2425],{"class":1109},[1081,2588,1113],{"class":1102},[1081,2590,1136],{"class":1135},[1081,2592,2432],{"class":1139},[1081,2594,1143],{"class":1135},[1081,2596,1266],{"class":1102},[1081,2598,2599,2602,2604],{"class":1083,"line":1164},[1081,2600,2601],{"class":1109}," layoutTransition",[1081,2603,1113],{"class":1102},[1081,2605,1116],{"class":1102},[1081,2607,2608,2610,2612,2614,2617,2619],{"class":1083,"line":1170},[1081,2609,1630],{"class":1109},[1081,2611,1113],{"class":1102},[1081,2613,1136],{"class":1135},[1081,2615,2616],{"class":1139},"slide-in",[1081,2618,1143],{"class":1135},[1081,2620,1266],{"class":1102},[1081,2622,2623],{"class":1083,"line":1255},[1081,2624,1167],{"class":1102},[1081,2626,2627,2629],{"class":1083,"line":1269},[1081,2628,1173],{"class":1102},[1081,2630,1176],{"class":1098},[1081,2632,2633,2635,2637],{"class":1083,"line":1279},[1081,2634,1233],{"class":1102},[1081,2636,1592],{"class":1213},[1081,2638,1217],{"class":1102},[1060,2640,2642],{"id":2641},"全局设置global-settings","全局设置（Global Settings）",[1027,2644,2645,2646,2649],{},"你可以使用 ",[1037,2647,2648],{},"nuxt.config"," 全局自定义这些默认的过渡名称。",[1027,2651,2652,2654,2655,2657,2658,2665,2666,2669,2670,2673],{},[1037,2653,1576],{}," 和 ",[1037,2656,2549],{}," 这两个键都接受 ",[1031,2659,2662],{"href":2660,"rel":2661},"https:\u002F\u002Fvuejs.org\u002Fapi\u002Fbuilt-in-components#transition",[1035],[1037,2663,2664],{},"TransitionProps"," 作为 JSON 可序列化的值，你可以向其中传递 ",[1037,2667,2668],{},"name","、",[1037,2671,2672],{},"mode"," 和自定义 CSS 过渡的其他有效 transition props。",[1072,2675,2677],{"className":1074,"code":2676,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n app: {\n pageTransition: {\n name: 'fade',\n mode: 'out-in', \u002F\u002F default\n },\n layoutTransition: {\n name: 'slide',\n mode: 'out-in', \u002F\u002F default\n },\n },\n})\n",[1037,2678,2679,2691,2699,2707,2723,2741,2746,2754,2769,2785,2789,2793],{"__ignoreMap":354},[1081,2680,2681,2683,2685,2687,2689],{"class":1083,"line":1084},[1081,2682,1088],{"class":1087},[1081,2684,1091],{"class":1087},[1081,2686,1095],{"class":1094},[1081,2688,1099],{"class":1098},[1081,2690,1103],{"class":1102},[1081,2692,2693,2695,2697],{"class":1083,"line":1106},[1081,2694,1110],{"class":1109},[1081,2696,1113],{"class":1102},[1081,2698,1116],{"class":1102},[1081,2700,2701,2703,2705],{"class":1083,"line":1119},[1081,2702,1122],{"class":1109},[1081,2704,1113],{"class":1102},[1081,2706,1116],{"class":1102},[1081,2708,2709,2712,2714,2716,2719,2721],{"class":1083,"line":1164},[1081,2710,2711],{"class":1109}," name",[1081,2713,1113],{"class":1102},[1081,2715,1136],{"class":1135},[1081,2717,2718],{"class":1139},"fade",[1081,2720,1143],{"class":1135},[1081,2722,1266],{"class":1102},[1081,2724,2725,2728,2730,2732,2734,2736,2738],{"class":1083,"line":1170},[1081,2726,2727],{"class":1109}," mode",[1081,2729,1113],{"class":1102},[1081,2731,1136],{"class":1135},[1081,2733,1156],{"class":1139},[1081,2735,1143],{"class":1135},[1081,2737,1146],{"class":1102},[1081,2739,2740],{"class":1705}," \u002F\u002F default\n",[1081,2742,2743],{"class":1083,"line":1255},[1081,2744,2745],{"class":1102}," },\n",[1081,2747,2748,2750,2752],{"class":1083,"line":1269},[1081,2749,1866],{"class":1109},[1081,2751,1113],{"class":1102},[1081,2753,1116],{"class":1102},[1081,2755,2756,2758,2760,2762,2765,2767],{"class":1083,"line":1279},[1081,2757,2711],{"class":1109},[1081,2759,1113],{"class":1102},[1081,2761,1136],{"class":1135},[1081,2763,2764],{"class":1139},"slide",[1081,2766,1143],{"class":1135},[1081,2768,1266],{"class":1102},[1081,2770,2771,2773,2775,2777,2779,2781,2783],{"class":1083,"line":1303},[1081,2772,2727],{"class":1109},[1081,2774,1113],{"class":1102},[1081,2776,1136],{"class":1135},[1081,2778,1156],{"class":1139},[1081,2780,1143],{"class":1135},[1081,2782,1146],{"class":1102},[1081,2784,2740],{"class":1705},[1081,2786,2787],{"class":1083,"line":1309},[1081,2788,2745],{"class":1102},[1081,2790,2791],{"class":1083,"line":1319},[1081,2792,1167],{"class":1102},[1081,2794,2795,2797],{"class":1083,"line":1329},[1081,2796,1173],{"class":1102},[1081,2798,1176],{"class":1098},[2800,2801,2802],"warning",{},[1027,2803,2804,2805,2807],{},"如果你更改了 ",[1037,2806,2668],{}," 属性，也必须相应地重命名 CSS 类。",[1027,2809,2810,2811,2813,2814,2816],{},"要覆盖全局过渡属性，请使用 ",[1037,2812,601],{}," 为单个 Nuxt 页面定义页面或布局过渡，并覆盖在 ",[1037,2815,2648],{}," 文件中全局定义的任何页面或布局过渡。",[1072,2818,2821],{"className":1200,"code":2819,"filename":2820,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n pageTransition: {\n name: 'bounce',\n mode: 'out-in', \u002F\u002F default\n },\n})\n\u003C\u002Fscript>\n","pages\u002Fsome-page.vue",[1037,2822,2823,2843,2851,2859,2874,2891,2895,2901],{"__ignoreMap":354},[1081,2824,2825,2827,2829,2831,2833,2835,2837,2839,2841],{"class":1083,"line":1084},[1081,2826,1210],{"class":1102},[1081,2828,1592],{"class":1213},[1081,2830,1595],{"class":1429},[1081,2832,1598],{"class":1429},[1081,2834,1433],{"class":1102},[1081,2836,1436],{"class":1135},[1081,2838,1076],{"class":1139},[1081,2840,1436],{"class":1135},[1081,2842,1217],{"class":1102},[1081,2844,2845,2847,2849],{"class":1083,"line":1106},[1081,2846,601],{"class":1094},[1081,2848,1099],{"class":1098},[1081,2850,1103],{"class":1102},[1081,2852,2853,2855,2857],{"class":1083,"line":1119},[1081,2854,1621],{"class":1109},[1081,2856,1113],{"class":1102},[1081,2858,1116],{"class":1102},[1081,2860,2861,2863,2865,2867,2870,2872],{"class":1083,"line":1164},[1081,2862,1630],{"class":1109},[1081,2864,1113],{"class":1102},[1081,2866,1136],{"class":1135},[1081,2868,2869],{"class":1139},"bounce",[1081,2871,1143],{"class":1135},[1081,2873,1266],{"class":1102},[1081,2875,2876,2879,2881,2883,2885,2887,2889],{"class":1083,"line":1170},[1081,2877,2878],{"class":1109}," mode",[1081,2880,1113],{"class":1102},[1081,2882,1136],{"class":1135},[1081,2884,1156],{"class":1139},[1081,2886,1143],{"class":1135},[1081,2888,1146],{"class":1102},[1081,2890,2740],{"class":1705},[1081,2892,2893],{"class":1083,"line":1255},[1081,2894,1167],{"class":1102},[1081,2896,2897,2899],{"class":1083,"line":1269},[1081,2898,1173],{"class":1102},[1081,2900,1176],{"class":1098},[1081,2902,2903,2905,2907],{"class":1083,"line":1279},[1081,2904,1233],{"class":1102},[1081,2906,1592],{"class":1213},[1081,2908,1217],{"class":1102},[1060,2910,2912],{"id":2911},"禁用过渡disable-transitions","禁用过渡（Disable Transitions）",[1027,2914,2915,2654,2917,2919],{},[1037,2916,1576],{},[1037,2918,2549],{}," 可以针对特定路由被禁用：",[1072,2921,2923],{"className":1200,"code":2922,"filename":2820,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n pageTransition: false,\n layoutTransition: false,\n})\n\u003C\u002Fscript>\n",[1037,2924,2925,2945,2953,2965,2975,2981],{"__ignoreMap":354},[1081,2926,2927,2929,2931,2933,2935,2937,2939,2941,2943],{"class":1083,"line":1084},[1081,2928,1210],{"class":1102},[1081,2930,1592],{"class":1213},[1081,2932,1595],{"class":1429},[1081,2934,1598],{"class":1429},[1081,2936,1433],{"class":1102},[1081,2938,1436],{"class":1135},[1081,2940,1076],{"class":1139},[1081,2942,1436],{"class":1135},[1081,2944,1217],{"class":1102},[1081,2946,2947,2949,2951],{"class":1083,"line":1106},[1081,2948,601],{"class":1094},[1081,2950,1099],{"class":1098},[1081,2952,1103],{"class":1102},[1081,2954,2955,2957,2959,2963],{"class":1083,"line":1119},[1081,2956,1621],{"class":1109},[1081,2958,1113],{"class":1102},[1081,2960,2962],{"class":2961},"si1Qm"," false",[1081,2964,1266],{"class":1102},[1081,2966,2967,2969,2971,2973],{"class":1083,"line":1164},[1081,2968,2601],{"class":1109},[1081,2970,1113],{"class":1102},[1081,2972,2962],{"class":2961},[1081,2974,1266],{"class":1102},[1081,2976,2977,2979],{"class":1083,"line":1170},[1081,2978,1173],{"class":1102},[1081,2980,1176],{"class":1098},[1081,2982,2983,2985,2987],{"class":1083,"line":1255},[1081,2984,1233],{"class":1102},[1081,2986,1592],{"class":1213},[1081,2988,1217],{"class":1102},[1027,2990,2991,2992,2994],{},"或者在 ",[1037,2993,2648],{}," 中全局禁用：",[1072,2996,2998],{"className":1074,"code":2997,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n app: {\n pageTransition: false,\n layoutTransition: false,\n },\n})\n",[1037,2999,3000,3012,3020,3030,3040,3044],{"__ignoreMap":354},[1081,3001,3002,3004,3006,3008,3010],{"class":1083,"line":1084},[1081,3003,1088],{"class":1087},[1081,3005,1091],{"class":1087},[1081,3007,1095],{"class":1094},[1081,3009,1099],{"class":1098},[1081,3011,1103],{"class":1102},[1081,3013,3014,3016,3018],{"class":1083,"line":1106},[1081,3015,1110],{"class":1109},[1081,3017,1113],{"class":1102},[1081,3019,1116],{"class":1102},[1081,3021,3022,3024,3026,3028],{"class":1083,"line":1119},[1081,3023,1122],{"class":1109},[1081,3025,1113],{"class":1102},[1081,3027,2962],{"class":2961},[1081,3029,1266],{"class":1102},[1081,3031,3032,3034,3036,3038],{"class":1083,"line":1164},[1081,3033,1866],{"class":1109},[1081,3035,1113],{"class":1102},[1081,3037,2962],{"class":2961},[1081,3039,1266],{"class":1102},[1081,3041,3042],{"class":1083,"line":1170},[1081,3043,1167],{"class":1102},[1081,3045,3046,3048],{"class":1083,"line":1255},[1081,3047,1173],{"class":1102},[1081,3049,1176],{"class":1098},[1060,3051,3053],{"id":3052},"javascript-钩子javascript-hooks","JavaScript 钩子（JavaScript Hooks）",[1027,3055,3056],{},"对于高级用例，你可以使用 JavaScript 钩子为你的 Nuxt 页面创建高度动态和自定义的过渡。",[1027,3058,3059,3060,3065],{},"这种方式非常适合 ",[1031,3061,3064],{"href":3062,"rel":3063},"https:\u002F\u002Fgsap.com",[1035],"GSAP"," 等 JavaScript 动画库的使用场景。",[1072,3067,3069],{"className":1200,"code":3068,"filename":2820,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n pageTransition: {\n name: 'custom-flip',\n mode: 'out-in',\n onBeforeEnter: (el) => {\n console.log('Before enter...')\n },\n onEnter: (el, done) => {},\n onAfterEnter: (el) => {},\n },\n})\n\u003C\u002Fscript>\n",[1037,3070,3071,3091,3099,3107,3122,3136,3159,3180,3184,3207,3224,3228,3234],{"__ignoreMap":354},[1081,3072,3073,3075,3077,3079,3081,3083,3085,3087,3089],{"class":1083,"line":1084},[1081,3074,1210],{"class":1102},[1081,3076,1592],{"class":1213},[1081,3078,1595],{"class":1429},[1081,3080,1598],{"class":1429},[1081,3082,1433],{"class":1102},[1081,3084,1436],{"class":1135},[1081,3086,1076],{"class":1139},[1081,3088,1436],{"class":1135},[1081,3090,1217],{"class":1102},[1081,3092,3093,3095,3097],{"class":1083,"line":1106},[1081,3094,601],{"class":1094},[1081,3096,1099],{"class":1098},[1081,3098,1103],{"class":1102},[1081,3100,3101,3103,3105],{"class":1083,"line":1119},[1081,3102,1621],{"class":1109},[1081,3104,1113],{"class":1102},[1081,3106,1116],{"class":1102},[1081,3108,3109,3111,3113,3115,3118,3120],{"class":1083,"line":1164},[1081,3110,1630],{"class":1109},[1081,3112,1113],{"class":1102},[1081,3114,1136],{"class":1135},[1081,3116,3117],{"class":1139},"custom-flip",[1081,3119,1143],{"class":1135},[1081,3121,1266],{"class":1102},[1081,3123,3124,3126,3128,3130,3132,3134],{"class":1083,"line":1170},[1081,3125,2878],{"class":1109},[1081,3127,1113],{"class":1102},[1081,3129,1136],{"class":1135},[1081,3131,1156],{"class":1139},[1081,3133,1143],{"class":1135},[1081,3135,1266],{"class":1102},[1081,3137,3138,3141,3143,3146,3150,3153,3157],{"class":1083,"line":1255},[1081,3139,3140],{"class":1094}," onBeforeEnter",[1081,3142,1113],{"class":1102},[1081,3144,3145],{"class":1102}," (",[1081,3147,3149],{"class":3148},"ssIVr","el",[1081,3151,3152],{"class":1102},")",[1081,3154,3156],{"class":3155},"sV7Px"," =>",[1081,3158,1116],{"class":1102},[1081,3160,3161,3164,3166,3169,3171,3173,3176,3178],{"class":1083,"line":1269},[1081,3162,3163],{"class":1098}," console",[1081,3165,1259],{"class":1102},[1081,3167,3168],{"class":1094},"log",[1081,3170,1099],{"class":1109},[1081,3172,1143],{"class":1135},[1081,3174,3175],{"class":1139},"Before enter...",[1081,3177,1143],{"class":1135},[1081,3179,1176],{"class":1109},[1081,3181,3182],{"class":1083,"line":1279},[1081,3183,2745],{"class":1102},[1081,3185,3186,3189,3191,3193,3195,3197,3200,3202,3204],{"class":1083,"line":1303},[1081,3187,3188],{"class":1094}," onEnter",[1081,3190,1113],{"class":1102},[1081,3192,3145],{"class":1102},[1081,3194,3149],{"class":3148},[1081,3196,1146],{"class":1102},[1081,3198,3199],{"class":3148}," done",[1081,3201,3152],{"class":1102},[1081,3203,3156],{"class":3155},[1081,3205,3206],{"class":1102}," {},\n",[1081,3208,3209,3212,3214,3216,3218,3220,3222],{"class":1083,"line":1309},[1081,3210,3211],{"class":1094}," onAfterEnter",[1081,3213,1113],{"class":1102},[1081,3215,3145],{"class":1102},[1081,3217,3149],{"class":3148},[1081,3219,3152],{"class":1102},[1081,3221,3156],{"class":3155},[1081,3223,3206],{"class":1102},[1081,3225,3226],{"class":1083,"line":1319},[1081,3227,1167],{"class":1102},[1081,3229,3230,3232],{"class":1083,"line":1329},[1081,3231,1173],{"class":1102},[1081,3233,1176],{"class":1098},[1081,3235,3236,3238,3240],{"class":1083,"line":1342},[1081,3237,1233],{"class":1102},[1081,3239,1592],{"class":1213},[1081,3241,1217],{"class":1102},[3243,3244,3245],"tip",{},[1027,3246,3247,3248,3251,3252,1186],{},"了解更多 ",[1037,3249,3250],{},"Transition"," 组件中可用的",[1031,3253,3256],{"href":3254,"rel":3255},"https:\u002F\u002Fvuejs.org\u002Fguide\u002Fbuilt-ins\u002Ftransition#javascript-hooks",[1035],"JavaScript 钩子",[1060,3258,3260],{"id":3259},"动态过渡dynamic-transitions","动态过渡（Dynamic Transitions）",[1027,3262,3263,3264,3266,3267,3270],{},"要应用使用条件逻辑的动态过渡，你可以利用内联 ",[1031,3265,102],{"href":101}," 来为 ",[1037,3268,3269],{},"to.meta.pageTransition"," 分配不同的过渡名称。",[1196,3272,3273,3830],{},[1072,3274,3277],{"className":1200,"code":3275,"filename":3276,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n pageTransition: {\n name: 'slide-right',\n mode: 'out-in',\n },\n middleware (to, from) {\n if (to.meta.pageTransition && typeof to.meta.pageTransition !== 'boolean') {\n to.meta.pageTransition.name = +to.params.id! > +from.params.id! ? 'slide-left' : 'slide-right'\n }\n },\n})\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Ch1>#{{ $route.params.id }}\u003C\u002Fh1>\n\u003C\u002Ftemplate>\n\n\u003Cstyle>\n.slide-left-enter-active,\n.slide-left-leave-active,\n.slide-right-enter-active,\n.slide-right-leave-active {\n transition: all 0.2s;\n}\n.slide-left-enter-from {\n opacity: 0;\n transform: translate(50px, 0);\n}\n.slide-left-leave-to {\n opacity: 0;\n transform: translate(-50px, 0);\n}\n.slide-right-enter-from {\n opacity: 0;\n transform: translate(-50px, 0);\n}\n.slide-right-leave-to {\n opacity: 0;\n transform: translate(50px, 0);\n}\n\u003C\u002Fstyle>\n","pages\u002F[id].vue",[1037,3278,3279,3299,3307,3315,3330,3344,3348,3368,3418,3494,3499,3503,3509,3517,3521,3529,3546,3555,3560,3569,3579,3589,3599,3609,3625,3630,3640,3651,3674,3679,3689,3700,3722,3727,3737,3748,3769,3774,3784,3795,3816,3821],{"__ignoreMap":354},[1081,3280,3281,3283,3285,3287,3289,3291,3293,3295,3297],{"class":1083,"line":1084},[1081,3282,1210],{"class":1102},[1081,3284,1592],{"class":1213},[1081,3286,1595],{"class":1429},[1081,3288,1598],{"class":1429},[1081,3290,1433],{"class":1102},[1081,3292,1436],{"class":1135},[1081,3294,1076],{"class":1139},[1081,3296,1436],{"class":1135},[1081,3298,1217],{"class":1102},[1081,3300,3301,3303,3305],{"class":1083,"line":1106},[1081,3302,601],{"class":1094},[1081,3304,1099],{"class":1098},[1081,3306,1103],{"class":1102},[1081,3308,3309,3311,3313],{"class":1083,"line":1119},[1081,3310,1621],{"class":1109},[1081,3312,1113],{"class":1102},[1081,3314,1116],{"class":1102},[1081,3316,3317,3319,3321,3323,3326,3328],{"class":1083,"line":1164},[1081,3318,1630],{"class":1109},[1081,3320,1113],{"class":1102},[1081,3322,1136],{"class":1135},[1081,3324,3325],{"class":1139},"slide-right",[1081,3327,1143],{"class":1135},[1081,3329,1266],{"class":1102},[1081,3331,3332,3334,3336,3338,3340,3342],{"class":1083,"line":1170},[1081,3333,2878],{"class":1109},[1081,3335,1113],{"class":1102},[1081,3337,1136],{"class":1135},[1081,3339,1156],{"class":1139},[1081,3341,1143],{"class":1135},[1081,3343,1266],{"class":1102},[1081,3345,3346],{"class":1083,"line":1255},[1081,3347,1167],{"class":1102},[1081,3349,3350,3354,3356,3359,3361,3364,3366],{"class":1083,"line":1269},[1081,3351,3353],{"class":3352},"syA7L"," middleware",[1081,3355,3145],{"class":1102},[1081,3357,3358],{"class":3148},"to",[1081,3360,1146],{"class":1102},[1081,3362,3363],{"class":3148}," from",[1081,3365,3152],{"class":1102},[1081,3367,1116],{"class":1102},[1081,3369,3370,3373,3375,3377,3379,3382,3384,3386,3390,3393,3395,3397,3399,3401,3403,3406,3408,3411,3413,3416],{"class":1083,"line":1279},[1081,3371,3372],{"class":1087}," if",[1081,3374,3145],{"class":1109},[1081,3376,3358],{"class":1098},[1081,3378,1259],{"class":1102},[1081,3380,3381],{"class":1098},"meta",[1081,3383,1259],{"class":1102},[1081,3385,1576],{"class":1098},[1081,3387,3389],{"class":3388},"sXPRQ"," &&",[1081,3391,3392],{"class":3388}," typeof",[1081,3394,1430],{"class":1098},[1081,3396,1259],{"class":1102},[1081,3398,3381],{"class":1098},[1081,3400,1259],{"class":1102},[1081,3402,1576],{"class":1098},[1081,3404,3405],{"class":3388}," !==",[1081,3407,1136],{"class":1135},[1081,3409,3410],{"class":1139},"boolean",[1081,3412,1143],{"class":1135},[1081,3414,3415],{"class":1109},") ",[1081,3417,1103],{"class":1102},[1081,3419,3420,3423,3425,3427,3429,3431,3433,3435,3438,3441,3443,3445,3448,3450,3453,3456,3459,3461,3464,3466,3468,3470,3472,3474,3477,3479,3482,3484,3487,3489,3491],{"class":1083,"line":1303},[1081,3421,3422],{"class":1098}," to",[1081,3424,1259],{"class":1102},[1081,3426,3381],{"class":1098},[1081,3428,1259],{"class":1102},[1081,3430,1576],{"class":1098},[1081,3432,1259],{"class":1102},[1081,3434,2668],{"class":1098},[1081,3436,3437],{"class":3388}," =",[1081,3439,3440],{"class":3388}," +",[1081,3442,3358],{"class":1098},[1081,3444,1259],{"class":1102},[1081,3446,3447],{"class":1098},"params",[1081,3449,1259],{"class":1102},[1081,3451,3452],{"class":1098},"id",[1081,3454,3455],{"class":3388},"!",[1081,3457,3458],{"class":3388}," >",[1081,3460,3440],{"class":3388},[1081,3462,3463],{"class":1098},"from",[1081,3465,1259],{"class":1102},[1081,3467,3447],{"class":1098},[1081,3469,1259],{"class":1102},[1081,3471,3452],{"class":1098},[1081,3473,3455],{"class":3388},[1081,3475,3476],{"class":3388}," ?",[1081,3478,1136],{"class":1135},[1081,3480,3481],{"class":1139},"slide-left",[1081,3483,1143],{"class":1135},[1081,3485,3486],{"class":3388}," :",[1081,3488,1136],{"class":1135},[1081,3490,3325],{"class":1139},[1081,3492,3493],{"class":1135},"'\n",[1081,3495,3496],{"class":1083,"line":1309},[1081,3497,3498],{"class":1102}," }\n",[1081,3500,3501],{"class":1083,"line":1319},[1081,3502,1167],{"class":1102},[1081,3504,3505,3507],{"class":1083,"line":1329},[1081,3506,1173],{"class":1102},[1081,3508,1176],{"class":1098},[1081,3510,3511,3513,3515],{"class":1083,"line":1342},[1081,3512,1233],{"class":1102},[1081,3514,1592],{"class":1213},[1081,3516,1217],{"class":1102},[1081,3518,3519],{"class":1083,"line":1365},[1081,3520,1243],{"emptyLinePlaceholder":1242},[1081,3522,3523,3525,3527],{"class":1083,"line":1370},[1081,3524,1210],{"class":1102},[1081,3526,1214],{"class":1213},[1081,3528,1217],{"class":1102},[1081,3530,3531,3533,3535,3537,3540,3542,3544],{"class":1083,"line":1810},[1081,3532,1222],{"class":1102},[1081,3534,1407],{"class":1213},[1081,3536,1410],{"class":1102},[1081,3538,3539],{"class":1098},"#{{ $route.params.id }}",[1081,3541,1233],{"class":1102},[1081,3543,1407],{"class":1213},[1081,3545,1217],{"class":1102},[1081,3547,3549,3551,3553],{"class":1083,"line":3548},17,[1081,3550,1233],{"class":1102},[1081,3552,1214],{"class":1213},[1081,3554,1217],{"class":1102},[1081,3556,3558],{"class":1083,"line":3557},18,[1081,3559,1243],{"emptyLinePlaceholder":1242},[1081,3561,3563,3565,3567],{"class":1083,"line":3562},19,[1081,3564,1210],{"class":1102},[1081,3566,1250],{"class":1213},[1081,3568,1217],{"class":1102},[1081,3570,3572,3574,3577],{"class":1083,"line":3571},20,[1081,3573,1259],{"class":1258},[1081,3575,3576],{"class":1262},"slide-left-enter-active",[1081,3578,1266],{"class":1102},[1081,3580,3582,3584,3587],{"class":1083,"line":3581},21,[1081,3583,1259],{"class":1258},[1081,3585,3586],{"class":1262},"slide-left-leave-active",[1081,3588,1266],{"class":1102},[1081,3590,3592,3594,3597],{"class":1083,"line":3591},22,[1081,3593,1259],{"class":1258},[1081,3595,3596],{"class":1262},"slide-right-enter-active",[1081,3598,1266],{"class":1102},[1081,3600,3602,3604,3607],{"class":1083,"line":3601},23,[1081,3603,1259],{"class":1258},[1081,3605,3606],{"class":1262},"slide-right-leave-active",[1081,3608,1116],{"class":1102},[1081,3610,3612,3614,3616,3618,3621,3623],{"class":1083,"line":3611},24,[1081,3613,1283],{"class":1282},[1081,3615,1113],{"class":1102},[1081,3617,1289],{"class":1288},[1081,3619,3620],{"class":1292}," 0.2",[1081,3622,1297],{"class":1296},[1081,3624,1300],{"class":1102},[1081,3626,3628],{"class":1083,"line":3627},25,[1081,3629,1306],{"class":1102},[1081,3631,3633,3635,3638],{"class":1083,"line":3632},26,[1081,3634,1259],{"class":1258},[1081,3636,3637],{"class":1262},"slide-left-enter-from",[1081,3639,1116],{"class":1102},[1081,3641,3643,3645,3647,3649],{"class":1083,"line":3642},27,[1081,3644,1332],{"class":1282},[1081,3646,1113],{"class":1102},[1081,3648,1337],{"class":1292},[1081,3650,1300],{"class":1102},[1081,3652,3654,3656,3658,3661,3663,3666,3668,3670,3672],{"class":1083,"line":3653},28,[1081,3655,1775],{"class":1282},[1081,3657,1113],{"class":1102},[1081,3659,3660],{"class":1350}," translate",[1081,3662,1099],{"class":1102},[1081,3664,3665],{"class":1292},"50",[1081,3667,2280],{"class":1296},[1081,3669,1146],{"class":1102},[1081,3671,1337],{"class":1292},[1081,3673,1362],{"class":1102},[1081,3675,3677],{"class":1083,"line":3676},29,[1081,3678,1306],{"class":1102},[1081,3680,3682,3684,3687],{"class":1083,"line":3681},30,[1081,3683,1259],{"class":1258},[1081,3685,3686],{"class":1262},"slide-left-leave-to",[1081,3688,1116],{"class":1102},[1081,3690,3692,3694,3696,3698],{"class":1083,"line":3691},31,[1081,3693,1332],{"class":1282},[1081,3695,1113],{"class":1102},[1081,3697,1337],{"class":1292},[1081,3699,1300],{"class":1102},[1081,3701,3703,3705,3707,3709,3711,3714,3716,3718,3720],{"class":1083,"line":3702},32,[1081,3704,1775],{"class":1282},[1081,3706,1113],{"class":1102},[1081,3708,3660],{"class":1350},[1081,3710,1099],{"class":1102},[1081,3712,3713],{"class":1292},"-50",[1081,3715,2280],{"class":1296},[1081,3717,1146],{"class":1102},[1081,3719,1337],{"class":1292},[1081,3721,1362],{"class":1102},[1081,3723,3725],{"class":1083,"line":3724},33,[1081,3726,1306],{"class":1102},[1081,3728,3730,3732,3735],{"class":1083,"line":3729},34,[1081,3731,1259],{"class":1258},[1081,3733,3734],{"class":1262},"slide-right-enter-from",[1081,3736,1116],{"class":1102},[1081,3738,3740,3742,3744,3746],{"class":1083,"line":3739},35,[1081,3741,1332],{"class":1282},[1081,3743,1113],{"class":1102},[1081,3745,1337],{"class":1292},[1081,3747,1300],{"class":1102},[1081,3749,3751,3753,3755,3757,3759,3761,3763,3765,3767],{"class":1083,"line":3750},36,[1081,3752,1775],{"class":1282},[1081,3754,1113],{"class":1102},[1081,3756,3660],{"class":1350},[1081,3758,1099],{"class":1102},[1081,3760,3713],{"class":1292},[1081,3762,2280],{"class":1296},[1081,3764,1146],{"class":1102},[1081,3766,1337],{"class":1292},[1081,3768,1362],{"class":1102},[1081,3770,3772],{"class":1083,"line":3771},37,[1081,3773,1306],{"class":1102},[1081,3775,3777,3779,3782],{"class":1083,"line":3776},38,[1081,3778,1259],{"class":1258},[1081,3780,3781],{"class":1262},"slide-right-leave-to",[1081,3783,1116],{"class":1102},[1081,3785,3787,3789,3791,3793],{"class":1083,"line":3786},39,[1081,3788,1332],{"class":1282},[1081,3790,1113],{"class":1102},[1081,3792,1337],{"class":1292},[1081,3794,1300],{"class":1102},[1081,3796,3798,3800,3802,3804,3806,3808,3810,3812,3814],{"class":1083,"line":3797},40,[1081,3799,1775],{"class":1282},[1081,3801,1113],{"class":1102},[1081,3803,3660],{"class":1350},[1081,3805,1099],{"class":1102},[1081,3807,3665],{"class":1292},[1081,3809,2280],{"class":1296},[1081,3811,1146],{"class":1102},[1081,3813,1337],{"class":1292},[1081,3815,1362],{"class":1102},[1081,3817,3819],{"class":1083,"line":3818},41,[1081,3820,1306],{"class":1102},[1081,3822,3824,3826,3828],{"class":1083,"line":3823},42,[1081,3825,1233],{"class":1102},[1081,3827,1250],{"class":1213},[1081,3829,1217],{"class":1102},[1072,3831,3833],{"className":1200,"code":3832,"filename":2057,"language":1203,"meta":354,"style":354},"\u003Cscript setup lang=\"ts\">\nconst route = useRoute()\nconst id = computed(() => Number(route.params.id || 1))\nconst prev = computed(() => '\u002F' + (id.value - 1))\nconst next = computed(() => '\u002F' + (id.value + 1))\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cdiv>\n \u003Cslot \u002F>\n \u003Cdiv v-if=\"$route.params.id\">\n \u003CNuxtLink :to=\"prev\">⬅️\u003C\u002FNuxtLink> |\n \u003CNuxtLink :to=\"next\">➡️\u003C\u002FNuxtLink>\n \u003C\u002Fdiv>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[1037,3834,3835,3855,3871,3913,3953,3991,3999,4003,4011,4019,4029,4049,4082,4110,4119,4127],{"__ignoreMap":354},[1081,3836,3837,3839,3841,3843,3845,3847,3849,3851,3853],{"class":1083,"line":1084},[1081,3838,1210],{"class":1102},[1081,3840,1592],{"class":1213},[1081,3842,1595],{"class":1429},[1081,3844,1598],{"class":1429},[1081,3846,1433],{"class":1102},[1081,3848,1436],{"class":1135},[1081,3850,1076],{"class":1139},[1081,3852,1436],{"class":1135},[1081,3854,1217],{"class":1102},[1081,3856,3857,3860,3863,3865,3868],{"class":1083,"line":1106},[1081,3858,3859],{"class":3155},"const",[1081,3861,3862],{"class":1288}," route",[1081,3864,3437],{"class":3388},[1081,3866,3867],{"class":1094}," useRoute",[1081,3869,3870],{"class":1098},"()\n",[1081,3872,3873,3875,3878,3880,3883,3885,3888,3890,3893,3896,3898,3900,3902,3905,3908,3910],{"class":1083,"line":1119},[1081,3874,3859],{"class":3155},[1081,3876,3877],{"class":1288}," id",[1081,3879,3437],{"class":3388},[1081,3881,3882],{"class":1094}," computed",[1081,3884,1099],{"class":1098},[1081,3886,3887],{"class":1102},"()",[1081,3889,3156],{"class":3155},[1081,3891,3892],{"class":1094}," Number",[1081,3894,3895],{"class":1098},"(route",[1081,3897,1259],{"class":1102},[1081,3899,3447],{"class":1098},[1081,3901,1259],{"class":1102},[1081,3903,3904],{"class":1098},"id ",[1081,3906,3907],{"class":3388},"||",[1081,3909,1789],{"class":1292},[1081,3911,3912],{"class":1098},"))\n",[1081,3914,3915,3917,3920,3922,3924,3926,3928,3930,3932,3934,3936,3938,3941,3943,3946,3949,3951],{"class":1083,"line":1164},[1081,3916,3859],{"class":3155},[1081,3918,3919],{"class":1288}," prev",[1081,3921,3437],{"class":3388},[1081,3923,3882],{"class":1094},[1081,3925,1099],{"class":1098},[1081,3927,3887],{"class":1102},[1081,3929,3156],{"class":3155},[1081,3931,1136],{"class":1135},[1081,3933,1522],{"class":1139},[1081,3935,1143],{"class":1135},[1081,3937,3440],{"class":3388},[1081,3939,3940],{"class":1098}," (id",[1081,3942,1259],{"class":1102},[1081,3944,3945],{"class":1098},"value ",[1081,3947,3948],{"class":3388},"-",[1081,3950,1789],{"class":1292},[1081,3952,3912],{"class":1098},[1081,3954,3955,3957,3960,3962,3964,3966,3968,3970,3972,3974,3976,3978,3980,3982,3984,3987,3989],{"class":1083,"line":1170},[1081,3956,3859],{"class":3155},[1081,3958,3959],{"class":1288}," next",[1081,3961,3437],{"class":3388},[1081,3963,3882],{"class":1094},[1081,3965,1099],{"class":1098},[1081,3967,3887],{"class":1102},[1081,3969,3156],{"class":3155},[1081,3971,1136],{"class":1135},[1081,3973,1522],{"class":1139},[1081,3975,1143],{"class":1135},[1081,3977,3440],{"class":3388},[1081,3979,3940],{"class":1098},[1081,3981,1259],{"class":1102},[1081,3983,3945],{"class":1098},[1081,3985,3986],{"class":3388},"+",[1081,3988,1789],{"class":1292},[1081,3990,3912],{"class":1098},[1081,3992,3993,3995,3997],{"class":1083,"line":1255},[1081,3994,1233],{"class":1102},[1081,3996,1592],{"class":1213},[1081,3998,1217],{"class":1102},[1081,4000,4001],{"class":1083,"line":1269},[1081,4002,1243],{"emptyLinePlaceholder":1242},[1081,4004,4005,4007,4009],{"class":1083,"line":1279},[1081,4006,1210],{"class":1102},[1081,4008,1214],{"class":1213},[1081,4010,1217],{"class":1102},[1081,4012,4013,4015,4017],{"class":1083,"line":1303},[1081,4014,1222],{"class":1102},[1081,4016,1397],{"class":1213},[1081,4018,1217],{"class":1102},[1081,4020,4021,4023,4025,4027],{"class":1083,"line":1309},[1081,4022,1404],{"class":1102},[1081,4024,2099],{"class":1213},[1081,4026,2103],{"class":2102},[1081,4028,1217],{"class":1102},[1081,4030,4031,4033,4035,4038,4040,4042,4045,4047],{"class":1083,"line":1319},[1081,4032,1404],{"class":1102},[1081,4034,1397],{"class":1213},[1081,4036,4037],{"class":1429}," v-if",[1081,4039,1433],{"class":1102},[1081,4041,1436],{"class":1135},[1081,4043,4044],{"class":1139},"$route.params.id",[1081,4046,1436],{"class":1135},[1081,4048,1217],{"class":1102},[1081,4050,4051,4054,4056,4059,4061,4063,4066,4068,4070,4073,4075,4077,4079],{"class":1083,"line":1329},[1081,4052,4053],{"class":1102}," \u003C",[1081,4055,1426],{"class":1213},[1081,4057,4058],{"class":1429}," :to",[1081,4060,1433],{"class":1102},[1081,4062,1436],{"class":1135},[1081,4064,4065],{"class":1139},"prev",[1081,4067,1436],{"class":1135},[1081,4069,1410],{"class":1102},[1081,4071,4072],{"class":1098},"⬅️",[1081,4074,1233],{"class":1102},[1081,4076,1426],{"class":1213},[1081,4078,1410],{"class":1102},[1081,4080,4081],{"class":1098}," |\n",[1081,4083,4084,4086,4088,4090,4092,4094,4097,4099,4101,4104,4106,4108],{"class":1083,"line":1342},[1081,4085,4053],{"class":1102},[1081,4087,1426],{"class":1213},[1081,4089,4058],{"class":1429},[1081,4091,1433],{"class":1102},[1081,4093,1436],{"class":1135},[1081,4095,4096],{"class":1139},"next",[1081,4098,1436],{"class":1135},[1081,4100,1410],{"class":1102},[1081,4102,4103],{"class":1098},"➡️",[1081,4105,1233],{"class":1102},[1081,4107,1426],{"class":1213},[1081,4109,1217],{"class":1102},[1081,4111,4112,4115,4117],{"class":1083,"line":1365},[1081,4113,4114],{"class":1102}," \u003C\u002F",[1081,4116,1397],{"class":1213},[1081,4118,1217],{"class":1102},[1081,4120,4121,4123,4125],{"class":1083,"line":1370},[1081,4122,1457],{"class":1102},[1081,4124,1397],{"class":1213},[1081,4126,1217],{"class":1102},[1081,4128,4129,4131,4133],{"class":1083,"line":1810},[1081,4130,1233],{"class":1102},[1081,4132,1214],{"class":1213},[1081,4134,1217],{"class":1102},[1027,4136,4137,4138,4140,4141,1194],{},"现在页面在前往下一个 id 时应用 ",[1037,4139,3481],{}," 过渡，在返回上一个时应用 ",[1037,4142,3325],{},[1555,4144,1560,4147],{"controls":1242,"className":4145,"poster":4146},[1558],"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665069410\u002Fnuxt3\u002Fnuxt-dynamic-page-transitions.jpg",[1562,4148],{"src":4149,"type":1565},"https:\u002F\u002Fres.cloudinary.com\u002Fnuxt\u002Fvideo\u002Fupload\u002Fv1665069410\u002Fnuxt3\u002Fnuxt-dynamic-page-transitions.mp4",[1060,4151,4153],{"id":4152},"配合-nuxtpage-的过渡transition-with-nuxtpage","配合 NuxtPage 的过渡（Transition with NuxtPage）",[1027,4155,4156,4157,4160,4161,4163,4164,4167],{},"当 ",[1037,4158,4159],{},"\u003CNuxtPage \u002F>"," 在 ",[1037,4162,118],{}," 中使用时，可以通过 ",[1037,4165,4166],{},"transition"," 属性配置过渡，从而全局启用过渡。",[1072,4169,4171],{"className":1200,"code":4170,"filename":1202,"language":1203,"meta":354,"style":354},"\u003Ctemplate>\n \u003Cdiv>\n \u003CNuxtLayout>\n \u003CNuxtPage\n :transition=\"{\n name: 'bounce',\n mode: 'out-in',\n }\"\n \u002F>\n \u003C\u002FNuxtLayout>\n \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n",[1037,4172,4173,4181,4189,4197,4204,4215,4220,4225,4233,4238,4246,4254],{"__ignoreMap":354},[1081,4174,4175,4177,4179],{"class":1083,"line":1084},[1081,4176,1210],{"class":1102},[1081,4178,1214],{"class":1213},[1081,4180,1217],{"class":1102},[1081,4182,4183,4185,4187],{"class":1083,"line":1106},[1081,4184,1222],{"class":1102},[1081,4186,1397],{"class":1213},[1081,4188,1217],{"class":1102},[1081,4190,4191,4193,4195],{"class":1083,"line":1119},[1081,4192,1404],{"class":1102},[1081,4194,1934],{"class":1213},[1081,4196,1217],{"class":1102},[1081,4198,4199,4201],{"class":1083,"line":1164},[1081,4200,4053],{"class":1102},[1081,4202,4203],{"class":1213},"NuxtPage\n",[1081,4205,4206,4209,4211,4213],{"class":1083,"line":1170},[1081,4207,4208],{"class":1429}," :transition",[1081,4210,1433],{"class":1102},[1081,4212,1436],{"class":1135},[1081,4214,1103],{"class":1139},[1081,4216,4217],{"class":1083,"line":1255},[1081,4218,4219],{"class":1139}," name: 'bounce',\n",[1081,4221,4222],{"class":1083,"line":1269},[1081,4223,4224],{"class":1139}," mode: 'out-in',\n",[1081,4226,4227,4230],{"class":1083,"line":1279},[1081,4228,4229],{"class":1139}," }",[1081,4231,4232],{"class":1135},"\"\n",[1081,4234,4235],{"class":1083,"line":1303},[1081,4236,4237],{"class":1102}," \u002F>\n",[1081,4239,4240,4242,4244],{"class":1083,"line":1309},[1081,4241,4114],{"class":1102},[1081,4243,1934],{"class":1213},[1081,4245,1217],{"class":1102},[1081,4247,4248,4250,4252],{"class":1083,"line":1319},[1081,4249,1457],{"class":1102},[1081,4251,1397],{"class":1213},[1081,4253,1217],{"class":1102},[1081,4255,4256,4258,4260],{"class":1083,"line":1329},[1081,4257,1233],{"class":1102},[1081,4259,1214],{"class":1213},[1081,4261,1217],{"class":1102},[1024,4263,4264],{},[1027,4265,4266,4267,4269],{},"注意，这种页面过渡无法被单个页面上的 ",[1037,4268,601],{}," 覆盖。",[1060,4271,4273],{"id":4272},"view-transitions-api实验性","View Transitions API（实验性）",[1027,4275,4276,4277,4284,4285,4290],{},"Nuxt 附带了一个实验性的 ",[1031,4278,4281],{"href":4279,"rel":4280},"https:\u002F\u002Fdeveloper.chrome.com\u002Fdocs\u002Fweb-platform\u002Fview-transitions",[1035],[1051,4282,4283],{},"View Transitions API"," 实现（参见 ",[1031,4286,4289],{"href":4287,"rel":4288},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FView_Transition_API",[1035],"MDN","）。这是一种令人兴奋的新方式，可以实现浏览器原生的过渡，其中（除其他能力外）能够跨不同页面上的不相关元素进行过渡。",[1027,4292,4293,4294,4299],{},"你可以在 ",[1031,4295,4298],{"href":4296,"rel":4297},"https:\u002F\u002Fstackblitz.com\u002Fedit\u002Fnuxt-view-transitions",[1035],"StackBlitz"," 上查看一个 demo。",[1027,4301,4302,4303,4306],{},"可以通过配置文件中的 ",[1037,4304,4305],{},"experimental.viewTransition"," 选项来启用 Nuxt 的集成：",[1072,4308,4310],{"className":1074,"code":4309,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n experimental: {\n viewTransition: true,\n },\n})\n",[1037,4311,4312,4324,4333,4345,4349],{"__ignoreMap":354},[1081,4313,4314,4316,4318,4320,4322],{"class":1083,"line":1084},[1081,4315,1088],{"class":1087},[1081,4317,1091],{"class":1087},[1081,4319,1095],{"class":1094},[1081,4321,1099],{"class":1098},[1081,4323,1103],{"class":1102},[1081,4325,4326,4329,4331],{"class":1083,"line":1106},[1081,4327,4328],{"class":1109}," experimental",[1081,4330,1113],{"class":1102},[1081,4332,1116],{"class":1102},[1081,4334,4335,4338,4340,4343],{"class":1083,"line":1119},[1081,4336,4337],{"class":1109}," viewTransition",[1081,4339,1113],{"class":1102},[1081,4341,4342],{"class":2961}," true",[1081,4344,1266],{"class":1102},[1081,4346,4347],{"class":1083,"line":1164},[1081,4348,1167],{"class":1102},[1081,4350,4351,4353],{"class":1083,"line":1170},[1081,4352,1173],{"class":1102},[1081,4354,1176],{"class":1098},[1027,4356,4357,4358,2669,4361,4364,4365,1186],{},"可选值为：",[1037,4359,4360],{},"false",[1037,4362,4363],{},"true"," 或 ",[1037,4366,4367],{},"'always'",[1027,4369,4370,4371,4374,4375,4378],{},"如果设置为 true，当用户的浏览器匹配 ",[1037,4372,4373],{},"prefers-reduced-motion: reduce"," 时，Nuxt 不会应用过渡（推荐）。如果设置为 ",[1037,4376,4377],{},"always","，Nuxt 将始终应用过渡，是否尊重用户偏好由你自己决定。",[1027,4380,4381,4382,4384],{},"默认情况下，视图过渡对所有 ",[1031,4383,1069],{"href":105}," 启用，但你可以设置一个不同的全局默认值。",[1072,4386,4388],{"className":1074,"code":4387,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n app: {\n \u002F\u002F Disable view transitions globally, and opt-in on a per page basis\n viewTransition: false,\n },\n})\n",[1037,4389,4390,4402,4410,4415,4425,4429],{"__ignoreMap":354},[1081,4391,4392,4394,4396,4398,4400],{"class":1083,"line":1084},[1081,4393,1088],{"class":1087},[1081,4395,1091],{"class":1087},[1081,4397,1095],{"class":1094},[1081,4399,1099],{"class":1098},[1081,4401,1103],{"class":1102},[1081,4403,4404,4406,4408],{"class":1083,"line":1106},[1081,4405,1110],{"class":1109},[1081,4407,1113],{"class":1102},[1081,4409,1116],{"class":1102},[1081,4411,4412],{"class":1083,"line":1119},[1081,4413,4414],{"class":1705}," \u002F\u002F Disable view transitions globally, and opt-in on a per page basis\n",[1081,4416,4417,4419,4421,4423],{"class":1083,"line":1164},[1081,4418,4337],{"class":1109},[1081,4420,1113],{"class":1102},[1081,4422,2962],{"class":2961},[1081,4424,1266],{"class":1102},[1081,4426,4427],{"class":1083,"line":1170},[1081,4428,1167],{"class":1102},[1081,4430,4431,4433],{"class":1083,"line":1255},[1081,4432,1173],{"class":1102},[1081,4434,1176],{"class":1098},[1027,4436,4437,4438,1573,4442,4445,4446,4448],{},"可以通过在页面的 ",[1031,4439,4440],{"href":600},[1037,4441,601],{},[1037,4443,4444],{},"viewTransition"," 键来覆盖该页面的默认 ",[1037,4447,4444],{}," 值：",[1072,4450,4452],{"className":1200,"code":4451,"filename":1583,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n viewTransition: false,\n})\n\u003C\u002Fscript>\n",[1037,4453,4454,4474,4482,4493,4499],{"__ignoreMap":354},[1081,4455,4456,4458,4460,4462,4464,4466,4468,4470,4472],{"class":1083,"line":1084},[1081,4457,1210],{"class":1102},[1081,4459,1592],{"class":1213},[1081,4461,1595],{"class":1429},[1081,4463,1598],{"class":1429},[1081,4465,1433],{"class":1102},[1081,4467,1436],{"class":1135},[1081,4469,1076],{"class":1139},[1081,4471,1436],{"class":1135},[1081,4473,1217],{"class":1102},[1081,4475,4476,4478,4480],{"class":1083,"line":1106},[1081,4477,601],{"class":1094},[1081,4479,1099],{"class":1098},[1081,4481,1103],{"class":1102},[1081,4483,4484,4487,4489,4491],{"class":1083,"line":1119},[1081,4485,4486],{"class":1109}," viewTransition",[1081,4488,1113],{"class":1102},[1081,4490,2962],{"class":2961},[1081,4492,1266],{"class":1102},[1081,4494,4495,4497],{"class":1083,"line":1164},[1081,4496,1173],{"class":1102},[1081,4498,1176],{"class":1098},[1081,4500,4501,4503,4505],{"class":1083,"line":1170},[1081,4502,1233],{"class":1102},[1081,4504,1592],{"class":1213},[1081,4506,1217],{"class":1102},[2800,4508,4509],{},[1027,4510,4511,4512,4514],{},"基于每个页面覆盖视图过渡，只有在你启用了 ",[1037,4513,4305],{}," 选项时才会生效。",[4516,4517,4519,4520],"h3",{"id":4518},"视图过渡类型view-transition-types-v44","视图过渡类型（View Transition Types） ",[4521,4522,4527],"badge",{"className":4523,"color":4525,"size":4526},[4524],"align-middle","info","xs","v4.4",[1027,4529,4530,4535],{},[1031,4531,4534],{"href":4532,"rel":4533},"https:\u002F\u002Fdeveloper.chrome.com\u002Fblog\u002Fview-transitions-update-io24#view-transition-types",[1035],"视图过渡类型"," 允许你根据导航的类型应用不同的 CSS 动画。这对于创建非对称过渡（例如，向前导航与向后导航时使用不同的动画）很有用。",[1027,4537,4538,4539,4546,4547,4554],{},"类型被设置在 ",[1031,4540,4543],{"href":4541,"rel":4542},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FViewTransition",[1035],[1037,4544,4545],{},"ViewTransition"," 上，并可以在 CSS 中使用 ",[1031,4548,4551],{"href":4549,"rel":4550},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FCSS\u002FReference\u002FSelectors\u002F:active-view-transition-type",[1035],[1037,4552,4553],{},":active-view-transition-type()"," 伪类选择器来定位。",[1027,4556,4293,4557,4559],{},[1037,4558,174],{}," 中全局设置默认类型：",[1072,4561,4563],{"className":1074,"code":4562,"filename":174,"language":1076,"meta":1077,"style":354},"export default defineNuxtConfig({\n app: {\n viewTransition: {\n enabled: true,\n types: ['slide'],\n },\n },\n})\n",[1037,4564,4565,4577,4585,4593,4604,4625,4629,4633],{"__ignoreMap":354},[1081,4566,4567,4569,4571,4573,4575],{"class":1083,"line":1084},[1081,4568,1088],{"class":1087},[1081,4570,1091],{"class":1087},[1081,4572,1095],{"class":1094},[1081,4574,1099],{"class":1098},[1081,4576,1103],{"class":1102},[1081,4578,4579,4581,4583],{"class":1083,"line":1106},[1081,4580,1110],{"class":1109},[1081,4582,1113],{"class":1102},[1081,4584,1116],{"class":1102},[1081,4586,4587,4589,4591],{"class":1083,"line":1119},[1081,4588,4337],{"class":1109},[1081,4590,1113],{"class":1102},[1081,4592,1116],{"class":1102},[1081,4594,4595,4598,4600,4602],{"class":1083,"line":1164},[1081,4596,4597],{"class":1109}," enabled",[1081,4599,1113],{"class":1102},[1081,4601,4342],{"class":2961},[1081,4603,1266],{"class":1102},[1081,4605,4606,4609,4611,4614,4616,4618,4620,4623],{"class":1083,"line":1170},[1081,4607,4608],{"class":1109}," types",[1081,4610,1113],{"class":1102},[1081,4612,4613],{"class":1098}," [",[1081,4615,1143],{"class":1135},[1081,4617,2764],{"class":1139},[1081,4619,1143],{"class":1135},[1081,4621,4622],{"class":1098},"]",[1081,4624,1266],{"class":1102},[1081,4626,4627],{"class":1083,"line":1255},[1081,4628,2745],{"class":1102},[1081,4630,4631],{"class":1083,"line":1269},[1081,4632,1167],{"class":1102},[1081,4634,4635,4637],{"class":1083,"line":1279},[1081,4636,1173],{"class":1102},[1081,4638,1176],{"class":1098},[1027,4640,4641,4642,4644],{},"或者使用 ",[1037,4643,601],{}," 按页面配置类型。按页面的类型同时支持静态数组和函数，以实现动态行为：",[1072,4646,4649],{"className":1200,"code":4647,"filename":4648,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n viewTransition: {\n enabled: true,\n \u002F\u002F Types applied to any transition involving this page\n types: ['slide'],\n \u002F\u002F Types applied only when navigating TO this page\n toTypes: ['slide-in'],\n \u002F\u002F Types applied only when navigating FROM this page\n fromTypes: ['slide-out'],\n },\n})\n\u003C\u002Fscript>\n","pages\u002Fdetail.vue",[1037,4650,4651,4671,4679,4687,4698,4703,4722,4727,4746,4751,4771,4775,4781],{"__ignoreMap":354},[1081,4652,4653,4655,4657,4659,4661,4663,4665,4667,4669],{"class":1083,"line":1084},[1081,4654,1210],{"class":1102},[1081,4656,1592],{"class":1213},[1081,4658,1595],{"class":1429},[1081,4660,1598],{"class":1429},[1081,4662,1433],{"class":1102},[1081,4664,1436],{"class":1135},[1081,4666,1076],{"class":1139},[1081,4668,1436],{"class":1135},[1081,4670,1217],{"class":1102},[1081,4672,4673,4675,4677],{"class":1083,"line":1106},[1081,4674,601],{"class":1094},[1081,4676,1099],{"class":1098},[1081,4678,1103],{"class":1102},[1081,4680,4681,4683,4685],{"class":1083,"line":1119},[1081,4682,4486],{"class":1109},[1081,4684,1113],{"class":1102},[1081,4686,1116],{"class":1102},[1081,4688,4689,4692,4694,4696],{"class":1083,"line":1164},[1081,4690,4691],{"class":1109}," enabled",[1081,4693,1113],{"class":1102},[1081,4695,4342],{"class":2961},[1081,4697,1266],{"class":1102},[1081,4699,4700],{"class":1083,"line":1170},[1081,4701,4702],{"class":1705}," \u002F\u002F Types applied to any transition involving this page\n",[1081,4704,4705,4708,4710,4712,4714,4716,4718,4720],{"class":1083,"line":1255},[1081,4706,4707],{"class":1109}," types",[1081,4709,1113],{"class":1102},[1081,4711,4613],{"class":1098},[1081,4713,1143],{"class":1135},[1081,4715,2764],{"class":1139},[1081,4717,1143],{"class":1135},[1081,4719,4622],{"class":1098},[1081,4721,1266],{"class":1102},[1081,4723,4724],{"class":1083,"line":1269},[1081,4725,4726],{"class":1705}," \u002F\u002F Types applied only when navigating TO this page\n",[1081,4728,4729,4732,4734,4736,4738,4740,4742,4744],{"class":1083,"line":1279},[1081,4730,4731],{"class":1109}," toTypes",[1081,4733,1113],{"class":1102},[1081,4735,4613],{"class":1098},[1081,4737,1143],{"class":1135},[1081,4739,2616],{"class":1139},[1081,4741,1143],{"class":1135},[1081,4743,4622],{"class":1098},[1081,4745,1266],{"class":1102},[1081,4747,4748],{"class":1083,"line":1303},[1081,4749,4750],{"class":1705}," \u002F\u002F Types applied only when navigating FROM this page\n",[1081,4752,4753,4756,4758,4760,4762,4765,4767,4769],{"class":1083,"line":1309},[1081,4754,4755],{"class":1109}," fromTypes",[1081,4757,1113],{"class":1102},[1081,4759,4613],{"class":1098},[1081,4761,1143],{"class":1135},[1081,4763,4764],{"class":1139},"slide-out",[1081,4766,1143],{"class":1135},[1081,4768,4622],{"class":1098},[1081,4770,1266],{"class":1102},[1081,4772,4773],{"class":1083,"line":1319},[1081,4774,1167],{"class":1102},[1081,4776,4777,4779],{"class":1083,"line":1329},[1081,4778,1173],{"class":1102},[1081,4780,1176],{"class":1098},[1081,4782,4783,4785,4787],{"class":1083,"line":1342},[1081,4784,1233],{"class":1102},[1081,4786,1592],{"class":1213},[1081,4788,1217],{"class":1102},[1027,4790,4791,4792,4794,4795,2669,4798,2654,4801,4804],{},"你也可以在 ",[1037,4793,601],{}," 中为 ",[1037,4796,4797],{},"types",[1037,4799,4800],{},"toTypes",[1037,4802,4803],{},"fromTypes"," 使用函数，以根据路由动态决定类型：",[1072,4806,4808],{"className":1200,"code":4807,"filename":3276,"language":1203,"meta":1077,"style":354},"\u003Cscript setup lang=\"ts\">\ndefinePageMeta({\n viewTransition: {\n enabled: true,\n toTypes: (to, from) => {\n \u002F\u002F Slide left when going to a higher ID, right otherwise\n return Number(to.params.id) > Number(from.params.id)\n ? ['slide-left']\n : ['slide-right']\n },\n },\n})\n\u003C\u002Fscript>\n",[1037,4809,4810,4830,4838,4846,4856,4876,4881,4920,4936,4951,4955,4959,4965],{"__ignoreMap":354},[1081,4811,4812,4814,4816,4818,4820,4822,4824,4826,4828],{"class":1083,"line":1084},[1081,4813,1210],{"class":1102},[1081,4815,1592],{"class":1213},[1081,4817,1595],{"class":1429},[1081,4819,1598],{"class":1429},[1081,4821,1433],{"class":1102},[1081,4823,1436],{"class":1135},[1081,4825,1076],{"class":1139},[1081,4827,1436],{"class":1135},[1081,4829,1217],{"class":1102},[1081,4831,4832,4834,4836],{"class":1083,"line":1106},[1081,4833,601],{"class":1094},[1081,4835,1099],{"class":1098},[1081,4837,1103],{"class":1102},[1081,4839,4840,4842,4844],{"class":1083,"line":1119},[1081,4841,4486],{"class":1109},[1081,4843,1113],{"class":1102},[1081,4845,1116],{"class":1102},[1081,4847,4848,4850,4852,4854],{"class":1083,"line":1164},[1081,4849,4691],{"class":1109},[1081,4851,1113],{"class":1102},[1081,4853,4342],{"class":2961},[1081,4855,1266],{"class":1102},[1081,4857,4858,4860,4862,4864,4866,4868,4870,4872,4874],{"class":1083,"line":1170},[1081,4859,4731],{"class":1094},[1081,4861,1113],{"class":1102},[1081,4863,3145],{"class":1102},[1081,4865,3358],{"class":3148},[1081,4867,1146],{"class":1102},[1081,4869,3363],{"class":3148},[1081,4871,3152],{"class":1102},[1081,4873,3156],{"class":3155},[1081,4875,1116],{"class":1102},[1081,4877,4878],{"class":1083,"line":1255},[1081,4879,4880],{"class":1705}," \u002F\u002F Slide left when going to a higher ID, right otherwise\n",[1081,4882,4883,4886,4888,4890,4892,4894,4896,4898,4900,4902,4904,4906,4908,4910,4912,4914,4916,4918],{"class":1083,"line":1269},[1081,4884,4885],{"class":1087}," return",[1081,4887,3892],{"class":1094},[1081,4889,1099],{"class":1109},[1081,4891,3358],{"class":1098},[1081,4893,1259],{"class":1102},[1081,4895,3447],{"class":1098},[1081,4897,1259],{"class":1102},[1081,4899,3452],{"class":1098},[1081,4901,3415],{"class":1109},[1081,4903,1410],{"class":3388},[1081,4905,3892],{"class":1094},[1081,4907,1099],{"class":1109},[1081,4909,3463],{"class":1098},[1081,4911,1259],{"class":1102},[1081,4913,3447],{"class":1098},[1081,4915,1259],{"class":1102},[1081,4917,3452],{"class":1098},[1081,4919,1176],{"class":1109},[1081,4921,4922,4925,4927,4929,4931,4933],{"class":1083,"line":1279},[1081,4923,4924],{"class":3388}," ?",[1081,4926,4613],{"class":1109},[1081,4928,1143],{"class":1135},[1081,4930,3481],{"class":1139},[1081,4932,1143],{"class":1135},[1081,4934,4935],{"class":1109},"]\n",[1081,4937,4938,4941,4943,4945,4947,4949],{"class":1083,"line":1303},[1081,4939,4940],{"class":3388}," :",[1081,4942,4613],{"class":1109},[1081,4944,1143],{"class":1135},[1081,4946,3325],{"class":1139},[1081,4948,1143],{"class":1135},[1081,4950,4935],{"class":1109},[1081,4952,4953],{"class":1083,"line":1309},[1081,4954,2745],{"class":1102},[1081,4956,4957],{"class":1083,"line":1319},[1081,4958,1167],{"class":1102},[1081,4960,4961,4963],{"class":1083,"line":1329},[1081,4962,1173],{"class":1102},[1081,4964,1176],{"class":1098},[1081,4966,4967,4969,4971],{"class":1083,"line":1342},[1081,4968,1233],{"class":1102},[1081,4970,1592],{"class":1213},[1081,4972,1217],{"class":1102},[1027,4974,4975],{},"然后在你的 CSS 中定位这些类型：",[1072,4977,4981],{"className":4978,"code":4979,"language":4980,"meta":354,"style":354},"language-css shiki shiki-themes material-theme-lighter github-dark material-theme-palenight","\u002F* Default crossfade *\u002F\n::view-transition-old(root),\n::view-transition-new(root) {\n animation-duration: 0.3s;\n}\n\n\u002F* Slide left animation *\u002F\nhtml:active-view-transition-type(slide-left) {\n &::view-transition-old(root) {\n animation: slide-out-left 0.3s ease-in-out;\n }\n &::view-transition-new(root) {\n animation: slide-in-right 0.3s ease-in-out;\n }\n}\n\n\u002F* Slide right animation *\u002F\nhtml:active-view-transition-type(slide-right) {\n &::view-transition-old(root) {\n animation: slide-out-right 0.3s ease-in-out;\n }\n &::view-transition-new(root) {\n animation: slide-in-left 0.3s ease-in-out;\n }\n}\n","css",[1037,4982,4983,4988,4993,5000,5014,5018,5022,5027,5041,5051,5071,5076,5083,5100,5104,5108,5112,5117,5129,5137,5154,5158,5164,5181,5185],{"__ignoreMap":354},[1081,4984,4985],{"class":1083,"line":1084},[1081,4986,4987],{"class":1705},"\u002F* Default crossfade *\u002F\n",[1081,4989,4990],{"class":1083,"line":1106},[1081,4991,4992],{"class":1098},"::view-transition-old(root),\n",[1081,4994,4995,4998],{"class":1083,"line":1119},[1081,4996,4997],{"class":1098},"::view-transition-new(root) ",[1081,4999,1103],{"class":1102},[1081,5001,5002,5005,5007,5010,5012],{"class":1083,"line":1164},[1081,5003,5004],{"class":1282}," animation-duration",[1081,5006,1113],{"class":1102},[1081,5008,5009],{"class":1292}," 0.3",[1081,5011,1297],{"class":1296},[1081,5013,1300],{"class":1102},[1081,5015,5016],{"class":1083,"line":1170},[1081,5017,1306],{"class":1102},[1081,5019,5020],{"class":1083,"line":1255},[1081,5021,1243],{"emptyLinePlaceholder":1242},[1081,5023,5024],{"class":1083,"line":1269},[1081,5025,5026],{"class":1705},"\u002F* Slide left animation *\u002F\n",[1081,5028,5029,5032,5035,5037,5039],{"class":1083,"line":1279},[1081,5030,5031],{"class":2141},"html",[1081,5033,5034],{"class":1098},":active-view-transition-type(",[1081,5036,3481],{"class":2141},[1081,5038,3415],{"class":1098},[1081,5040,1103],{"class":1102},[1081,5042,5043,5046,5048],{"class":1083,"line":1303},[1081,5044,5045],{"class":1098}," &",[1081,5047,1113],{"class":1102},[1081,5049,5050],{"class":1098},":view-transition-old(root) {\n",[1081,5052,5053,5056,5058,5061,5064,5066,5069],{"class":1083,"line":1309},[1081,5054,5055],{"class":1282}," animation",[1081,5057,1113],{"class":1102},[1081,5059,5060],{"class":1098}," slide-out-left ",[1081,5062,5063],{"class":1292},"0.3",[1081,5065,1297],{"class":1296},[1081,5067,5068],{"class":1288}," ease-in-out",[1081,5070,1300],{"class":1102},[1081,5072,5073],{"class":1083,"line":1319},[1081,5074,5075],{"class":1102}," }\n",[1081,5077,5078,5081],{"class":1083,"line":1329},[1081,5079,5080],{"class":1098}," &::view-transition-new(root) ",[1081,5082,1103],{"class":1102},[1081,5084,5085,5087,5089,5092,5094,5096,5098],{"class":1083,"line":1342},[1081,5086,5055],{"class":1282},[1081,5088,1113],{"class":1102},[1081,5090,5091],{"class":1098}," slide-in-right ",[1081,5093,5063],{"class":1292},[1081,5095,1297],{"class":1296},[1081,5097,5068],{"class":1288},[1081,5099,1300],{"class":1102},[1081,5101,5102],{"class":1083,"line":1365},[1081,5103,5075],{"class":1102},[1081,5105,5106],{"class":1083,"line":1370},[1081,5107,1306],{"class":1098},[1081,5109,5110],{"class":1083,"line":1810},[1081,5111,1243],{"emptyLinePlaceholder":1242},[1081,5113,5114],{"class":1083,"line":3548},[1081,5115,5116],{"class":1705},"\u002F* Slide right animation *\u002F\n",[1081,5118,5119,5121,5123,5125,5127],{"class":1083,"line":3557},[1081,5120,5031],{"class":2141},[1081,5122,5034],{"class":1098},[1081,5124,3325],{"class":2141},[1081,5126,3415],{"class":1098},[1081,5128,1103],{"class":1102},[1081,5130,5131,5133,5135],{"class":1083,"line":3562},[1081,5132,5045],{"class":1098},[1081,5134,1113],{"class":1102},[1081,5136,5050],{"class":1098},[1081,5138,5139,5141,5143,5146,5148,5150,5152],{"class":1083,"line":3571},[1081,5140,5055],{"class":1282},[1081,5142,1113],{"class":1102},[1081,5144,5145],{"class":1098}," slide-out-right ",[1081,5147,5063],{"class":1292},[1081,5149,1297],{"class":1296},[1081,5151,5068],{"class":1288},[1081,5153,1300],{"class":1102},[1081,5155,5156],{"class":1083,"line":3581},[1081,5157,5075],{"class":1102},[1081,5159,5160,5162],{"class":1083,"line":3591},[1081,5161,5080],{"class":1098},[1081,5163,1103],{"class":1102},[1081,5165,5166,5168,5170,5173,5175,5177,5179],{"class":1083,"line":3601},[1081,5167,5055],{"class":1282},[1081,5169,1113],{"class":1102},[1081,5171,5172],{"class":1098}," slide-in-left ",[1081,5174,5063],{"class":1292},[1081,5176,1297],{"class":1296},[1081,5178,5068],{"class":1288},[1081,5180,1300],{"class":1102},[1081,5182,5183],{"class":1083,"line":3611},[1081,5184,5075],{"class":1102},[1081,5186,5187],{"class":1083,"line":3627},[1081,5188,1306],{"class":1098},[1024,5190,5191],{},[1027,5192,5193,2669,5195,2654,5197,5199,5200,5202,5203,5205,5206,1058],{},[1037,5194,4797],{},[1037,5196,4800],{},[1037,5198,4803],{}," 的函数值只能在 ",[1037,5201,601],{}," 中使用，而不能在 ",[1037,5204,174],{}," 中使用（那里只支持静态 ",[1037,5207,5208],{},"string[]",[1027,5210,5211,5214,5215,5220,5221,5227,5228,5231],{},[1037,5212,5213],{},"page:view-transition:start"," 钩子提供了对 ",[1031,5216,5218],{"href":4541,"rel":5217},[1035],[1037,5219,4545],{}," 对象的访问，其中包含可以在运行时读取或修改的 ",[1031,5222,5225],{"href":5223,"rel":5224},"https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FAPI\u002FViewTransition\u002Ftypes",[1035],[1037,5226,4797],{}," 属性（",[1037,5229,5230],{},"ViewTransitionTypeSet","）：",[1072,5233,5236],{"className":1074,"code":5234,"filename":5235,"language":1076,"meta":354,"style":354},"export default defineNuxtPlugin((nuxtApp) => {\n nuxtApp.hook('page:view-transition:start', (transition) => {\n \u002F\u002F Read or modify types at runtime\n console.log([...transition.types])\n })\n})\n","plugins\u002Fview-transition.client.ts",[1037,5237,5238,5260,5290,5295,5319,5326],{"__ignoreMap":354},[1081,5239,5240,5242,5244,5247,5249,5251,5254,5256,5258],{"class":1083,"line":1084},[1081,5241,1088],{"class":1087},[1081,5243,1091],{"class":1087},[1081,5245,5246],{"class":1094}," defineNuxtPlugin",[1081,5248,1099],{"class":1098},[1081,5250,1099],{"class":1102},[1081,5252,5253],{"class":3148},"nuxtApp",[1081,5255,3152],{"class":1102},[1081,5257,3156],{"class":3155},[1081,5259,1116],{"class":1102},[1081,5261,5262,5265,5267,5270,5272,5274,5276,5278,5280,5282,5284,5286,5288],{"class":1083,"line":1106},[1081,5263,5264],{"class":1098}," nuxtApp",[1081,5266,1259],{"class":1102},[1081,5268,5269],{"class":1094},"hook",[1081,5271,1099],{"class":1109},[1081,5273,1143],{"class":1135},[1081,5275,5213],{"class":1139},[1081,5277,1143],{"class":1135},[1081,5279,1146],{"class":1102},[1081,5281,3145],{"class":1102},[1081,5283,4166],{"class":3148},[1081,5285,3152],{"class":1102},[1081,5287,3156],{"class":3155},[1081,5289,1116],{"class":1102},[1081,5291,5292],{"class":1083,"line":1119},[1081,5293,5294],{"class":1705}," \u002F\u002F Read or modify types at runtime\n",[1081,5296,5297,5300,5302,5304,5307,5310,5312,5314,5316],{"class":1083,"line":1164},[1081,5298,5299],{"class":1098}," console",[1081,5301,1259],{"class":1102},[1081,5303,3168],{"class":1094},[1081,5305,5306],{"class":1109},"([",[1081,5308,5309],{"class":3388},"...",[1081,5311,4166],{"class":1098},[1081,5313,1259],{"class":1102},[1081,5315,4797],{"class":1098},[1081,5317,5318],{"class":1109},"])\n",[1081,5320,5321,5324],{"class":1083,"line":1170},[1081,5322,5323],{"class":1102}," }",[1081,5325,1176],{"class":1109},[1081,5327,5328,5330],{"class":1083,"line":1255},[1081,5329,1173],{"class":1102},[1081,5331,1176],{"class":1098},[1027,5333,5334,5335,2654,5337,5339,5340,5343],{},"如果你同时使用 Vue 过渡（如 ",[1037,5336,1576],{},[1037,5338,2549],{},"，见上文）来实现与新的 View Transitions API 相同的效果，那么你可能希望在用户的浏览器支持这个更新的原生 Web API 时_禁用_ Vue 过渡。可以通过创建 ",[1037,5341,5342],{},"~\u002Fmiddleware\u002Fdisable-vue-transitions.global.ts"," 并填入以下内容来实现：",[1072,5345,5347],{"className":1074,"code":5346,"language":1076,"meta":354,"style":354},"export default defineNuxtRouteMiddleware((to) => {\n if (import.meta.server || !document.startViewTransition) {\n return\n }\n\n \u002F\u002F Disable built-in Vue transitions\n to.meta.pageTransition = false\n to.meta.layoutTransition = false\n})\n",[1037,5348,5349,5370,5406,5411,5415,5419,5424,5442,5458],{"__ignoreMap":354},[1081,5350,5351,5353,5355,5358,5360,5362,5364,5366,5368],{"class":1083,"line":1084},[1081,5352,1088],{"class":1087},[1081,5354,1091],{"class":1087},[1081,5356,5357],{"class":1094}," defineNuxtRouteMiddleware",[1081,5359,1099],{"class":1098},[1081,5361,1099],{"class":1102},[1081,5363,3358],{"class":3148},[1081,5365,3152],{"class":1102},[1081,5367,3156],{"class":3155},[1081,5369,1116],{"class":1102},[1081,5371,5372,5375,5377,5380,5382,5384,5386,5388,5391,5394,5397,5399,5402,5404],{"class":1083,"line":1106},[1081,5373,5374],{"class":1087}," if",[1081,5376,3145],{"class":1109},[1081,5378,5379],{"class":1087},"import",[1081,5381,1259],{"class":1102},[1081,5383,3381],{"class":1288},[1081,5385,1259],{"class":1102},[1081,5387,150],{"class":1098},[1081,5389,5390],{"class":3388}," ||",[1081,5392,5393],{"class":3388}," !",[1081,5395,5396],{"class":1098},"document",[1081,5398,1259],{"class":1102},[1081,5400,5401],{"class":1098},"startViewTransition",[1081,5403,3415],{"class":1109},[1081,5405,1103],{"class":1102},[1081,5407,5408],{"class":1083,"line":1119},[1081,5409,5410],{"class":1087}," return\n",[1081,5412,5413],{"class":1083,"line":1164},[1081,5414,5075],{"class":1102},[1081,5416,5417],{"class":1083,"line":1170},[1081,5418,1243],{"emptyLinePlaceholder":1242},[1081,5420,5421],{"class":1083,"line":1255},[1081,5422,5423],{"class":1705}," \u002F\u002F Disable built-in Vue transitions\n",[1081,5425,5426,5429,5431,5433,5435,5437,5439],{"class":1083,"line":1269},[1081,5427,5428],{"class":1098}," to",[1081,5430,1259],{"class":1102},[1081,5432,3381],{"class":1098},[1081,5434,1259],{"class":1102},[1081,5436,1576],{"class":1098},[1081,5438,3437],{"class":3388},[1081,5440,5441],{"class":2961}," false\n",[1081,5443,5444,5446,5448,5450,5452,5454,5456],{"class":1083,"line":1279},[1081,5445,5428],{"class":1098},[1081,5447,1259],{"class":1102},[1081,5449,3381],{"class":1098},[1081,5451,1259],{"class":1102},[1081,5453,2549],{"class":1098},[1081,5455,3437],{"class":3388},[1081,5457,5441],{"class":2961},[1081,5459,5460,5462],{"class":1083,"line":1303},[1081,5461,1173],{"class":1102},[1081,5463,1176],{"class":1098},[4516,5465,5467],{"id":5466},"已知问题known-issues","已知问题（Known Issues）",[5469,5470,5471],"ul",{},[5472,5473,5474,5475,5478],"li",{},"如果你在页面的 setup 函数中执行数据获取，目前可能希望暂时不要使用这个功能。（根据设计，View Transitions 在进行期间会完全冻结 DOM 更新。）我们正在考虑将 View Transition 限制在 ",[1037,5476,5477],{},"\u003CSuspense>"," 解析之前的最后时刻，但在此期间，如果你属于这种情况，可能需要仔细考虑是否采用该功能。",[1250,5480,5481],{},"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 .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 pre.shiki code .sF54B, html code.shiki .sF54B{--shiki-light:#39ADB5;--shiki-default:#E1E4E8;--shiki-dark:#89DDFF}html pre.shiki code .sOtFm, html code.shiki .sOtFm{--shiki-light:#E53935;--shiki-default:#E1E4E8;--shiki-dark:#F07178}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 .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 .s6g6u, html code.shiki .s6g6u{--shiki-light:#E53935;--shiki-default:#85E89D;--shiki-dark:#F07178}html pre.shiki code .szLpQ, html code.shiki .szLpQ{--shiki-light:#39ADB5;--shiki-default:#B392F0;--shiki-dark:#89DDFF}html pre.shiki code .sJK67, html code.shiki .sJK67{--shiki-light:#E2931D;--shiki-default:#B392F0;--shiki-dark:#FFCB6B}html pre.shiki code .sETrE, html code.shiki .sETrE{--shiki-light:#8796B0;--shiki-default:#79B8FF;--shiki-dark:#B2CCD6}html pre.shiki code .sJTDI, html code.shiki .sJTDI{--shiki-light:#90A4AE;--shiki-default:#79B8FF;--shiki-dark:#BABED8}html pre.shiki code .sOUxV, html code.shiki .sOUxV{--shiki-light:#F76D47;--shiki-default:#79B8FF;--shiki-dark:#F78C6C}html pre.shiki code .sZr3Q, html code.shiki .sZr3Q{--shiki-light:#F76D47;--shiki-default:#F97583;--shiki-dark:#F78C6C}html pre.shiki code .scsZY, html code.shiki .scsZY{--shiki-light:#6182B8;--shiki-default:#79B8FF;--shiki-dark:#82AAFF}html pre.shiki code .sXjFp, html code.shiki .sXjFp{--shiki-light:#9C3EDA;--shiki-default:#B392F0;--shiki-dark:#C792EA}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 .sMKz0, html code.shiki .sMKz0{--shiki-light:#39ADB5;--shiki-light-font-style:inherit;--shiki-default:#FDAEB7;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:inherit}html pre.shiki code .sv6Pl, html code.shiki .sv6Pl{--shiki-light:#E2931D;--shiki-default:#85E89D;--shiki-dark:#FFCB6B}html pre.shiki code .s0q4w, html code.shiki .s0q4w{--shiki-light:#39ADB5;--shiki-default:#79B8FF;--shiki-dark:#89DDFF}html pre.shiki code .si1Qm, html code.shiki .si1Qm{--shiki-light:#FF5370;--shiki-default:#79B8FF;--shiki-dark:#FF9CAC}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 .sV7Px, html code.shiki .sV7Px{--shiki-light:#9C3EDA;--shiki-default:#F97583;--shiki-dark:#C792EA}html pre.shiki code .syA7L, html code.shiki .syA7L{--shiki-light:#E53935;--shiki-default:#B392F0;--shiki-dark:#F07178}html pre.shiki code .sXPRQ, html code.shiki .sXPRQ{--shiki-light:#39ADB5;--shiki-default:#F97583;--shiki-dark:#89DDFF}",{"title":354,"searchDepth":1119,"depth":1119,"links":5483},[5484,5485,5486,5487,5488,5489,5490,5491],{"id":1062,"depth":1106,"text":1063},{"id":1829,"depth":1106,"text":1830},{"id":2641,"depth":1106,"text":2642},{"id":2911,"depth":1106,"text":2912},{"id":3052,"depth":1106,"text":3053},{"id":3259,"depth":1106,"text":3260},{"id":4152,"depth":1106,"text":4153},{"id":4272,"depth":1106,"text":4273,"children":5492},[5493,5495],{"id":4518,"depth":1119,"text":5494},"视图过渡类型（View Transition Types） v4.4",{"id":5466,"depth":1119,"text":5467},"md",{},"[object Object]",{"title":38,"description":39},"docs\u002F1.getting-started\u002F09.transitions","hL1hSbTNQLfCso59EoT-mzcuzQ3-1M9xPMIJwi11Mew",1785179852180]