NuxtApp

在 Nuxt 中，你可以在可组合项、组件和插件中访问运行时应用上下文。

¥In Nuxt, you can access runtime app context within composables, components and plugins.

:

在 Nuxt 2 中，这被称为 Nuxt 上下文。

¥In Nuxt 2, this was referred to as Nuxt context.

::

Nuxt 应用界面

¥Nuxt App Interface

:

跳过 NuxtApp 接口文档。

¥Jump over the NuxtApp interface documentation.

::

Nuxt 上下文

¥The Nuxt Context

许多可组合组件和实用程序（包括内置的和用户自定义的）可能需要访问 Nuxt 实例。这并非存在于你的应用的任何地方，因为每次请求都会创建一个新的实例。

¥Many composables and utilities, both built-in and user-made, may require access to the Nuxt instance. This doesn't exist everywhere on your application, because a fresh instance is created on every request.

目前，Nuxt 上下文仅在 plugins、Nuxt 钩子、Nuxt 中间件（如果封装在 defineNuxtRouteMiddleware 中）和 设置函数（在页面和组件中）中可访问。

¥Currently, the Nuxt context is only accessible in plugins, Nuxt hooks, Nuxt middleware (if wrapped in defineNuxtRouteMiddleware), and setup functions (in pages and components).

如果在未访问上下文的情况下调用可组合函数，你可能会收到一条错误，指出 '需要访问 Nuxt 实例的可组合项在插件、Nuxt 钩子、Nuxt 中间件或 Vue 设置函数之外被调用。'。在这种情况下，你也可以使用 nuxtApp.runWithContext 显式调用此上下文中的函数。

¥If a composable is called without access to the context, you may get an error stating that 'A composable that requires access to the Nuxt instance was called outside of a plugin, Nuxt hook, Nuxt middleware, or Vue setup function.' In that case, you can also explicitly call functions within this context by using nuxtApp.runWithContext.

访问 NuxtApp

¥Accessing NuxtApp

在可组合项、插件和组件中，你可以使用 useNuxtApp() 访问 nuxtApp：

¥Within composables, plugins and components you can access nuxtApp with useNuxtApp():

export function useMyComposable () {
  const nuxtApp = useNuxtApp()
  // access runtime nuxt app instance
}

如果你的可组合项并非总是需要 nuxtApp，或者你只是想检查它是否存在（由于 useNuxtApp 会引发异常），你可以改用 tryUseNuxtApp。

¥If your composable does not always need nuxtApp or you simply want to check if it is present or not, since useNuxtApp throws an exception, you can use tryUseNuxtApp instead.

为了方便起见，插件也接收 nuxtApp 作为第一个参数。

¥Plugins also receive nuxtApp as the first argument for convenience.

提供帮助函数

¥Providing Helpers

你可以提供助手函数，使其可在所有可组合组件和应用中使用。这通常发生在 Nuxt 插件中。

¥You can provide helpers to be usable across all composables and application. This usually happens within a Nuxt plugin.

const nuxtApp = useNuxtApp()
nuxtApp.provide('hello', (name) => `Hello ${name}!`)

console.log(nuxtApp.$hello('name')) // Prints "Hello name!"

:

可以通过在插件中返回带有 provide 键的对象来注入辅助函数。

¥It is possible to inject helpers by returning an object with a provide key in plugins.

::

:

在 Nuxt 2 插件中，这被称为注入函数。

¥In Nuxt 2 plugins, this was referred to as inject function.

::