Skip to content

Traduction de context.md #25

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Oct 13, 2017
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 23 additions & 23 deletions en/api/context.md
Original file line number Diff line number Diff line change
@@ -1,28 +1,28 @@
---
title: "API: The Context"
description: The `context` provides additional objects/params from Nuxt not traditionally available to Vue components. The `context` is available in special nuxt lifecycle areas like `asyncData`, `plugins`, 'middlewares', 'modules', and 'store/nuxtServerInit`.
title: "API : le contexte"
description: L'objet `context` fournit des objets et paramètres additionnels en provenance de Nuxt qui ne sont pas traditionnellement disponibles dans les composants Vue. Le `context` est disponible dans des aires de cycle de vie spécifique à Nuxt. On y retrouve, par exemple, `asyncData`, `plugins`, 'middlewares', 'modules', et 'store/nuxtServerInit`.
---

## Context (En)
## Contexte

<p style="width: 294px;position: fixed; top : 64px; right: 4px;" class="Alert Alert--orange"><strong>⚠Cette page est actuellement en cours de traduction française. Vous pouvez repasser plus tard ou <a href="https://github.com/vuejs-fr/nuxt" target="_blank">participer à la traduction</a> de celle-ci dès maintenant !</strong></p><p>List of all the available keys in `context`:</p>
Liste de toutes les propriétés disponibles dans `context` :

| Key | Type | Available | Description |
|-----|------|--------------|-------------|
| `app` | Root Vue Instance | Client & Server | The root vue instance that includes all your plugins. For example, when using `axios`, you can get access to `$axios` through `context.app.$axios`
| `isClient` | Boolean | Client & Server | Boolean to let you know if you're actually renderer from the client-side |
| `isServer` | Boolean | Client & Server | Boolean to let you know if you're actually renderer from the server-side |
| `isStatic` | Boolean | Client & Server | Boolean to let you know if you're actually inside a generated app (via `nuxt generate`) |
| `isDev` | Boolean | Client & Server | Boolean to let you know if you're in dev mode, can be useful for caching some data in production |
| `isHMR` | Boolean | Client & Server | Boolean to let you know if you're the method/middleware is called from webpack hot module replacement (*only on client-side in dev mode*) |
| `route` | [vue-router route](https://router.vuejs.org/en/api/route-object.html) | Client & Server | `vue-router` route instance. |
| `store` | [vuex store](http://vuex.vuejs.org/en/api.html#vuexstore-instance-properties) | Client & Server | `Vuex.Store` instance. **Available only if the [vuex store](/guide/vuex-store) is set** |
| `env` | Object | Client & Server | Environment variables set in `nuxt.config.js`, see [env api](/api/configuration-env) |
| `params` | Object | Client & Server | Alias of route.params |
| `query` | Object | Client & Server | Alias of route.query |
| `req` | [http.Request](https://nodejs.org/api/http.html#http_class_http_incomingmessage) | Server | Request from the node.js server. If nuxt is used as a middleware, the req object might be different depending of the framework you're using.<br>**Not available via `nuxt generate`** |
| `res` | [http.Response](https://nodejs.org/api/http.html#http_class_http_serverresponse) | Server | Response from the node.js server. If nuxt is used as a middleware, the res object might be different depending of the framework you're using.<br>**Not available via `nuxt generate`** |
| `redirect` | Function | Client & Server | Use this method to redirect the user to another route, the status code is used on the server-side, default to 302. `redirect([status,] path [, query])` |
| `error` | Function | Client & Server | Use this method to show the error page: `error(params)`. The `params` should have the fields `statusCode` and `message` |
| `nuxtState` | Object | Client | Nuxt state, useful for plugins which uses `beforeNuxtRender` to get the nuxt state on client-side before hydration. **Available only in `universal` mode.**
| `beforeNuxtRender(fn)` | Function | Server | Use this method to update `__NUXT__` variable rendered on client-side, the `fn` (can be asynchronous) is called with `{ Components, nuxtState }`, see [example](https://github.com/nuxt/nuxt.js/blob/cf6b0df45f678c5ac35535d49710c606ab34787d/test/fixtures/basic/pages/special-state.vue). |
| Propriété | Type | Disponibilité | Description |
|------------------------|------------------------------------------------------------------------------------|-------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `app` | Instance racine de Vue | Client et serveur | L'instance racine de Vue qui inclue tous vos plugins. Par exemple, en utilisant `axios`, vous avez accès à `$axios` à travers `context.app.$axios`. |
| `isClient` | `Boolean` | Client et serveur | Valeur booléenne vous permettant de savoir si le rendu est effectué côté client. |
| `isServer` | `Boolean` | Client et serveur | Valeur booléenne vous permettant de savoir si le rendu est effectué côté serveur. |
| `isStatic` | `Boolean` | Client et serveur | Valeur booléenne vous permettant de savoir si l'application est générée (via `nuxt generate`). |
| `isDev` | `Boolean` | Client et serveur | Valeur booléenne vous permettant de savoir si vous êtes en mode développement, ceci peut-être utile pour mettre des données en cache en production. |
| `isHMR` | `Boolean` | Client et serveur | Valeur booléenne vous permettant de savoir si les méthodes et middlewares sont appelés depuis le système de rechargement à chaud des modules webpack (*seule sur la partie cliente en mode développement*) |
| `route` | [Route Vue Router](https://router.vuejs.org/fr/api/route-object.html) | Client et serveur | L'instance route Vue Router. |
| `store` | [Store Vuex](https://vuex.vuejs.org/fr/api.html#propriétés-dinstance-de-vuexstore) | Client et serveur | L'instance du store Vuex. **Disponible uniquement si le [store Vuex](/guide/vuex-store) est défini**. |
| `env` | `Object` | Client et serveur | Variables d'environnement définies dans `nuxt.config.js`, consulter [env](/api/configuration-env) dans l'API. |
| `params` | `Object` | Client et serveur | Alias de `route.params`. |
| `query` | `Object` | Client et serveur | Alias de `route.query`. |
| `req` | [`http.Request`](https://nodejs.org/api/http.html#http_class_http_incomingmessage) | Serveur | Requête faite au serveur Node.js. Si Nuxt est utilisé en tant que middleware, l'objet `req` peut être différent en fonction du framework utilisé.<br>**Non disponible avec `nuxt generate`**. |
| `res` | [`http.Response`](https://nodejs.org/api/http.html#http_class_http_serverresponse) | Serveur | Réponse faite par le serveur Node.js. Si Nuxt est utilisé en tant que middleware, l'objet `res` peut être différent en fonction du framework utilisé.<br>**Non disponible avec `nuxt generate`**. |
| `redirect` | `Function` | Client et serveur | Cette méthode redirige l'utilisateur vers une autre route, un code de statut est utilisé côté serveur, par défaut c'est le `302`. `redirect([status,] path [, query])`. |
| `error` | `Function` | Client et serveur | Cette méthode montre la page d'erreur : `error(params)`. L'objet `params` devrait avoir les propriétés `statusCode` et `message`. |
| `nuxtState` | `Object` | Client | L'état de Nuxt, utile pour les plugins qui utilisent `beforeNuxtRender` pour connaitre l'état de Nuxt côté client avant l'hydratation. **Disponible seulement en mode `universal`**. |
| `beforeNuxtRender(fn)` | `Function` | Serveur | Cette méthode met à jour la variable `__NUXT__` rendue côté client, la fonction `fn` (pouvant être asynchrone) est appelée avec `{ Components, nuxtState }`, voir cet [exemple](https://github.com/nuxt/nuxt.js/blob/cf6b0df45f678c5ac35535d49710c606ab34787d/test/fixtures/basic/pages/special-state.vue). |