asyncData、fetch、mounted 有什么区别
先理解原理和示例，再练习完整口述与追问。
回答要点
asyncData 用于页面，无 this，通过返回值合并数据；Nuxt 2.12+ 新 fetch 可用于组件并访问实例，有 $fetchState；mounted 只在客户端运行，不能为服务端首屏提供数据。旧版 fetch(context) 语义不同，回答前先说清版本。
原理拆解
Nuxt2 asyncData 是页面级数据获取入口，其返回数据合并到页面状态，不能通过组件 this 访问实例；初次服务端请求与客户端路由跳转的执行环境不同。Nuxt2.12 引入的新 fetch 支持组件与状态，并提供 $fetchState 等能力，与旧 fetch(context) 语义不同。mounted 只在客户端挂载后执行，不适合独占 SSR 首屏必需数据。
示例与推演
Nuxt2 页面可写 async asyncData({params,$axios,error})，请求 params.id 对应记录后 return {detail}；不存在时通过 error 显示正确状态。对非关键侧栏可使用适用版本的新 fetch 并单独展示 pending/error。仅需客户端的图表库放 mounted 或 .client 插件，不要把所有页面请求都搬到 mounted。
易错点
回答前说明 Nuxt2 版本和 fetch 是旧式还是新式。服务端取得认证要来自当前请求，不能依赖 localStorage；重复数据获取也要核对路由跳转与水合是否重复触发。
参考回答可直接练习口述
Nuxt2 的 asyncData 仅用于页面，在实例访问之前通过上下文获取数据，不能用组件 this，返回对象合并到页面数据；它会参与服务端首屏和客户端路由切换。Nuxt2.12+ 新 fetch 可用于组件并访问 this，有 $fetchState 表示 pending/error；旧 fetch(context) 是另一种语义。mounted 只在客户端，因此不提供 SSR 首屏数据。页面关键数据按需要放 asyncData 或 fetch，不要全部等 mounted 才请求。
面试官可能继续问追问与完整解答展开收起
追问
客户端切换路由会怎样？query 改变是否重新请求？asyncData 可用 watchQuery，新的 fetch 则需要按需监听并调用 $fetch。Nuxt2 官方数据获取说明
追问回答
客户端切换页面时会按 Nuxt 机制执行相应数据钩子，不是只在服务器执行一次。仅 query 变化时 asyncData 默认不自动重取，可配置 watchQuery；Nuxt2.12+ 新 fetch 不由 watchQuery 自动控制，应监听必要 query 并调用 $fetch。重复请求时同样保护旧响应。