Skip to content

Commit cbe6e39

Browse files
committed
Consistency for
async => asynchrone(s) Webpack => webpack Promise => `Promise`
1 parent d646539 commit cbe6e39

File tree

1 file changed

+9
-9
lines changed

1 file changed

+9
-9
lines changed

src/v2/guide/components-dynamic-async.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Composants dynamiques & async
2+
title: Composants dynamiques et asynchrones
33
type: guide
44
order: 105
55
---
@@ -199,7 +199,7 @@ Désormais, l'onglet _Posts_ conserve son état (le post sélectionné) même lo
199199

200200
Pour plus de détails sur `<keep-alive>`, consultez la [référence API](../api/#keep-alive).
201201

202-
## Composants async
202+
## Composants asynchrones
203203

204204
Dans de grosses applications, nous pouvons avoir besoin de diviser l'application en morceaux plus petits et charger un composant depuis le serveur seulement lorsque celui-ci est requis. Pour rendre cela plus facile, Vue vous permet de définir un composant en tant que fonction usine qui va résoudre de façon asynchrone la définition de votre composant. Vue déclenchera la fonction usine seulement lorsque le rendu du composant est nécessaire, et mettra en cache le résultat pour les futurs nouveaux rendus. Par exemple :
205205

@@ -214,23 +214,23 @@ Vue.component('exemple-async', function (resolve, reject) {
214214
})
215215
```
216216

217-
Comme vous pouvez le voir, la fonction usine reçoit en paramètre `resolve`, une fonction de rappel (*callback*) qui sera appelée lorsque vous aurez récupéré la définition du composant depuis le serveur. Vous pouvez également appeler `reject(raison)` pour indiquer que le chargement a échoué pour une certaine raison. Le `setTimeout` est là en guise de démonstration ; à vous de décider comment vous souhaitez récupérer le composant. Une approche recommandée est d'utiliser les composants async conjointement avec la [fonctionnalité de découpage de code de Webpack](https://webpack.js.org/guides/code-splitting/):
217+
Comme vous pouvez le voir, la fonction usine reçoit en paramètre `resolve`, une fonction de rappel (*callback*) qui sera appelée lorsque vous aurez récupéré la définition du composant depuis le serveur. Vous pouvez également appeler `reject(raison)` pour indiquer que le chargement a échoué pour une certaine raison. Le `setTimeout` est là en guise de démonstration ; à vous de décider comment vous souhaitez récupérer le composant. Une approche recommandée est d'utiliser les composants asynchrones conjointement avec la [fonctionnalité de découpage de code de webpack](https://webpack.js.org/guides/code-splitting/):
218218

219219
``` js
220220
Vue.component('exemple-webpack-async', function (resolve) {
221-
// Cette syntaxe spéciale `require` indique à Webpack de
221+
// Cette syntaxe spéciale `require` indique à webpack de
222222
// diviser automatiquement votre code en sortie en paquets
223223
// qui seront chargés via des requêtes AJAX.
224224
require(['./mon-composant-async'], resolve)
225225
})
226226
```
227227

228-
Vous pouvez également retourner une `Promise` dans la fonction usine, ainsi avec Webpack 2 et la syntaxe ES2015 vous pourrez écrire :
228+
Vous pouvez également retourner une `Promise` dans la fonction usine, ainsi avec webpack 2 et la syntaxe ES2015 vous pourrez écrire :
229229

230230
``` js
231231
Vue.component(
232232
'exemple-webpack-async',
233-
// La fonction `import` retourne une Promise.
233+
// La fonction `import` retourne une `Promise`.
234234
() => import('./mon-composant-async')
235235
)
236236
```
@@ -246,17 +246,17 @@ new Vue({
246246
})
247247
```
248248

249-
<p class="tip">Si vous êtes un utilisateur de <strong>Browserify</strong> et souhaitez utiliser les composants async, son créateur a malheureusement [été très clair](https://github.com/substack/node-browserify/issues/58#issuecomment-21978224) sur le fait que le chargement asynchrone n'est pas quelque-chose que Browserify supportera un jour. Officiellement du moins. La communauté Browserify a trouvé [quelques solutions de contournement](https://github.com/vuejs/vuejs.org/issues/620), qui peuvent s'avérer utiles pour les applications complexes existantes. Pour tous les autres scénarios, nous recommandons d'utiliser Webpack pour un support natif et de première classe de l'asynchrone.</p>
249+
<p class="tip">Si vous êtes un utilisateur de <strong>Browserify</strong> et souhaitez utiliser les composants asynchrones, son créateur a malheureusement [été très clair](https://github.com/substack/node-browserify/issues/58#issuecomment-21978224) sur le fait que le chargement asynchrone n'est pas quelque-chose que Browserify supportera un jour. Officiellement du moins. La communauté Browserify a trouvé [quelques solutions de contournement](https://github.com/vuejs/vuejs.org/issues/620), qui peuvent s'avérer utiles pour les applications complexes existantes. Pour tous les autres scénarios, nous recommandons d'utiliser webpack pour un support natif et de première classe de l'asynchrone.</p>
250250

251251
### Gérer l'état de chargement
252252

253253
> Nouveauté de la 2.3.0+
254254
255-
La fabrique de composants async peut aussi retourner un objet avec le format suivant :
255+
La fabrique de composants asynchrones peut aussi retourner un objet avec le format suivant :
256256

257257
``` js
258258
const AsyncComponent = () => ({
259-
// Le composant à charger (doit être une Promise)
259+
// Le composant à charger (doit être une `Promise`)
260260
component: import('./MonComposant.vue'),
261261
// Un composant à utiliser pendant que le composant asynchrone se charge
262262
loading: LoadingComponent,

0 commit comments

Comments
 (0)