Skip to content

Commit ca63190

Browse files
committed
Sync with EN version for continue translation
Merge remote-tracking branch 'upstream/master' # Conflicts resolved: # src/v2/api/index.md # src/v2/cookbook/serverless-blog.md # src/v2/guide/components-custom-events.md # src/v2/guide/components-dynamic-async.md # src/v2/guide/components-edge-cases.md # src/v2/guide/components-props.md # src/v2/guide/components-registration.md # src/v2/guide/components-slots.md # src/v2/guide/computed.md # src/v2/guide/conditional.md # src/v2/guide/forms.md # src/v2/guide/index.md # src/v2/guide/installation.md # src/v2/guide/instance.md # src/v2/guide/list.md # src/v2/guide/render-function.md # src/v2/guide/syntax.md # themes/vue/layout/partials/ecosystem_dropdown.ejs Signed-off-by: Haeresis <[email protected]>
2 parents 721eea0 + 43ee479 commit ca63190

40 files changed

+1560
-189
lines changed

assets/why-vue/arabic.js.srt

Lines changed: 586 additions & 0 deletions
Large diffs are not rendered by default.

src/v2/api/index.md

Lines changed: 152 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,8 @@ type: api
8484
8585
> En 2.4.0+ ce hook capture également les erreurs lancées depuis un gestionnaire d'évènement Vue personnalisé.
8686
87+
> $todo In 2.6.0+, this hook also captures errors thrown inside `v-on` DOM listeners. In addition, if any of the covered hooks or handlers returns a Promise chain (e.g. async functions), the error from that Promise chain will also be handled.
88+
8789
> [Sentry](https://sentry.io) et [Bugsnag](https://docs.bugsnag.com/platforms/browsers/vue/) fournissent une intégration officielle utilisant cette option.
8890
8991
### warnHandler
@@ -402,6 +404,35 @@ type: api
402404

403405
- **Voir aussi :** [Fonctions de rendu](../guide/render-function.html)
404406

407+
### $todo Vue.observable( object )
408+
409+
> New in 2.6.0+
410+
411+
- **Arguments:**
412+
- `{Object} object`
413+
414+
- **Usage:**
415+
416+
Make an object reactive. Internally, Vue uses this on the object returned by the `data` function.
417+
418+
The returned object can be used directly inside [render functions](../guide/render-function.html) and [computed properties](../guide/computed.html), and will trigger appropriate updates when mutated. It can also be used as a minimal, cross-component state store for simple scenarios:
419+
420+
``` js
421+
const state = Vue.observable({ count: 0 })
422+
423+
const Demo = {
424+
render(h) {
425+
return h('button', {
426+
on: { click: () => { state.count++ }}
427+
}, `count is: ${state.count}`)
428+
}
429+
}
430+
```
431+
432+
<p class="tip">In Vue 2.x, `Vue.observable` directly mutates the object passed to it, so that it is equivalent to the object returned, as [demonstrated here](../guide/instance.html#Data-and-Methods). In Vue 3.x, a reactive proxy will be returned instead, leaving the original object non-reactive if mutated directly. Therefore, for future compatibility, we recommend always working with the object returned by `Vue.observable`, rather than the object originally passed to it.</p>
433+
434+
- **See also:** [Reactivity in Depth](../guide/reactivity.html)
435+
405436
### Vue.version
406437

407438
- **Détails :** donne la version de Vue installée sous forme de `String`. C'est particulièrement utile pour les plugins et les composants de la communauté, où vous pouvez être amenés à utiliser différentes stratégies pour différentes versions.
@@ -478,6 +509,15 @@ type: api
478509

479510
Une liste ou un objet décrivant les attributs exposés par le composant afin de passer des données depuis le composant parent. Ce paramètre a une syntaxe simple basée sur un tableau (`Array`) et une syntaxe alternative basée sur un objet (`Object`) qui permet une configuration avancée telle qu'une vérification de typage, des contrôles de validation personnalisés et des valeurs par défaut.
480511

512+
$todo With Object-based syntax, you can use following options:
513+
- **type:** can be one of the following native constructors: `String`, `Number`, `Boolean`, `Array`, `Object`, `Date`, `Function`, `Symbol`, any custom constructor function or an array of those. Will check if a prop has a given type, and will throw a warning if it doesn't. [More information](../guide/components-props.html#Prop-Types) on prop types.
514+
- **default:** `any`
515+
Specifies a default value for the prop. If the prop is not passed, this value will be used instead. Object or array defaults must be returned from a factory function.
516+
- **required:** `Boolean`
517+
Defines if the prop is required. In a non-production environment, a console warning will be thrown if this value is truthy and the prop is not passed.
518+
- **validator:** `Function`
519+
Custom validator function that takes the prop value as the sole argument. In a non-production environment, a console warning will be thrown if this function returns a falsy value (i.e. the validation fails). You can read more about prop validation [here](../guide/components-props.html#Prop-Validation).
520+
481521
- **Exemple :**
482522

483523
``` js
@@ -504,7 +544,7 @@ type: api
504544
})
505545
```
506546

507-
- **Voir aussi :** [Props](../guide/components.html#Props)
547+
- **Voir aussi :** [Props](../guide/components-props.html)
508548

509549
### propsData
510550

@@ -667,7 +707,7 @@ type: api
667707

668708
### el
669709

670-
- **Type :** `string | HTMLElement`
710+
- **Type :** `string | Element`
671711

672712
- **Restriction :** uniquement respecté quand l'instance est créée via `new`.
673713

@@ -1280,7 +1320,7 @@ type: api
12801320
12811321
### vm.$el
12821322
1283-
- **Type :** `HTMLElement`
1323+
- **Type :** `Element`
12841324
12851325
- **Accessible uniquement en lecture**
12861326
@@ -1391,7 +1431,7 @@ type: api
13911431
13921432
> Nouveau dans la 2.1.0+
13931433
1394-
- **Type :** `{ [name: string]: props => VNode | Array<VNode> }`
1434+
- **Type :** `{ [name: string]: props => Array<VNode> | undefined }`
13951435
13961436
- **Accessible uniquement en lecture**
13971437
@@ -1401,6 +1441,12 @@ type: api
14011441
14021442
Accéder à `vm.$scopedSlots` est surtout utile lors de l'écriture d'un composant avec une [fonction de rendu](../guide/render-function.html).
14031443
1444+
**$todo Note:** since 2.6.0+, there are two notable changes to this property:
1445+
1446+
1. Scoped slot functions are now guaranteed to return an array of VNodes, unless the return value is invalid, in which case the function will return `undefined`.
1447+
1448+
2. All `$slots` are now also exposed on `$scopedSlots` as functions. If you work with render functions, it is now recommended to always access slots via `$scopedSlots`, whether they currently use a scope or not. This will not only make future refactors to add a scope simpler, but also ease your eventual migration to Vue 3, where all slots will be functions.
1449+
14041450
- **Voir aussi :**
14051451
- [Composant `<slot>`](#slot-1)
14061452
- [Slots avec portée](../guide/components.html#Slots-avec-portee)
@@ -1948,7 +1994,7 @@ type: api
19481994

19491995
### v-for
19501996

1951-
- **Attend comme valeur :** `Array | Object | number | string`
1997+
- **Attend comme valeur :** `Array | Object | number | string | Iterable (depuis 2.6)`
19521998

19531999
- **Utilisation :**
19542000

@@ -1976,6 +2022,8 @@ type: api
19762022
</div>
19772023
```
19782024

2025+
$todo In 2.6+, `v-for` can also work on values that implement the [Iterable Protocol](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol), including native `Map` and `Set`. However, it should be noted that Vue 2.x currently does not support reactivity on `Map` and `Set` values, so cannot automatically detect changes.
2026+
19792027
<p class="tip">Quand utilisé conjointement avec v-if, v-for a une plus grande priorité que v-if. Consultez le <a href="../guide/list.html#v-for-with-v-if">guide de rendu de listes</a> pour plus de détails.</p>
19802028

19812029
L'usage détaillé pour `v-for` est expliqué dans la section du guide indiquée ci-dessous.
@@ -2021,12 +2069,18 @@ type: api
20212069
<!-- nom de méthode -->
20222070
<button v-on:click="faireCeci"></button>
20232071

2072+
<!-- $todo dynamic event (2.6.0+) -->
2073+
<button v-on:[event]="doThis"></button>
2074+
20242075
<!-- ligne d'instruction -->
20252076
<button v-on:click="faireCela('hello', $event)"></button>
20262077

20272078
<!-- notation abrégée -->
20282079
<button @click="faireCeci"></button>
20292080

2081+
<!-- $todo shorthand dynamic event (2.6.0+) -->
2082+
<button @[event]="doThis"></button>
2083+
20302084
<!-- stoppe la propagation -->
20312085
<button @click.stop="faireCeci"></button>
20322086

@@ -2097,9 +2151,15 @@ type: api
20972151
<!-- lie un attribut -->
20982152
<img v-bind:src="imageSrc">
20992153

2154+
<!-- $todo dynamic attribute name (2.6.0+) -->
2155+
<button v-bind:[key]="value"></button>
2156+
21002157
<!-- notation abrégée -->
21012158
<img :src="imageSrc">
21022159

2160+
<!-- $todo shorthand dynamic attribute name (2.6.0+) -->
2161+
<button :[key]="value"></button>
2162+
21032163
<!-- avec de la concaténation de chaines de caractères -->
21042164
<img :src="'/path/to/images/' + fileName">
21052165

@@ -2164,6 +2224,59 @@ type: api
21642224
- [Liaisons sur les champs de formulaire](../guide/forms.html)
21652225
- [Composants - Composants de champ de formulaire utilisant les évènements personnalisés](../guide/components.html#Composants-de-champ-de-formulaire-utilisant-les-evenements-personnalises)
21662226

2227+
### $todo v-slot
2228+
2229+
- **Shorthand:** `#`
2230+
2231+
- **Expects:** JavaScript expression that is valid in a function argument position (supports destructuring in [supported environments](../guide/components-slots.html#Slot-Props-Destructuring)). Optional - only needed if expecting props to be passed to the slot.
2232+
2233+
- **Argument:** slot name (optional, defaults to `default`)
2234+
2235+
- **Limited to:**
2236+
- `<template>`
2237+
- [components](../guide/components-slots.html#Abbreviated-Syntax-for-Lone-Default-Slots) (for a lone default slot with props)
2238+
2239+
- **Usage:**
2240+
2241+
Denote named slots or slots that expect to receive props.
2242+
2243+
- **Example:**
2244+
2245+
```html
2246+
<!-- Named slots -->
2247+
<base-layout>
2248+
<template v-slot:header>
2249+
Header content
2250+
</template>
2251+
2252+
Default slot content
2253+
2254+
<template v-slot:footer>
2255+
Footer content
2256+
</template>
2257+
</base-layout>
2258+
2259+
<!-- Named slot that receives props -->
2260+
<infinite-scroll>
2261+
<template v-slot:item="slotProps">
2262+
<div class="item">
2263+
{{ slotProps.item.text }}
2264+
</div>
2265+
</template>
2266+
</infinite-scroll>
2267+
2268+
<!-- Default slot that receive props, with destructuring -->
2269+
<mouse-position v-slot="{ x, y }">
2270+
Mouse position: {{ x }}, {{ y }}
2271+
</mouse-position>
2272+
```
2273+
2274+
For more details, see the links below.
2275+
2276+
- **See also:**
2277+
- [Components - Slots](../guide/components-slots.html)
2278+
- [RFC-0001](https://github.com/vuejs/rfcs/blob/master/active-rfcs/0001-new-slot-syntax.md)
2279+
21672280
### v-pre
21682281

21692282
- **N'attend aucune valeur**
@@ -2283,38 +2396,6 @@ type: api
22832396

22842397
- **Voir aussi :** [Les refs des composants enfants](../guide/components.html#Les-refs-des-composants-enfants)
22852398

2286-
### slot
2287-
2288-
- **Attend comme valeur :** `string`
2289-
2290-
Utilisé sur du contenu inséré dans les composants enfants afin d'indiquer à quel slot nommé le contenu doit être associé.
2291-
2292-
Pour un usage détaillé, veuillez consulter la section du guide en lien ci-dessous.
2293-
2294-
- **Voir aussi :** [Slots nommés](../guide/components.html#Slots-nommes)
2295-
2296-
### slot-scope
2297-
2298-
> Nouveau dans la 2.5.0+
2299-
2300-
- **Attend comme valeur :** `function argument expression`
2301-
2302-
- **Utilisation :**
2303-
2304-
Utilisé pour indiquer qu'un élément ou un composant a un slot avec portée. La valeur de l'attribut doit être une expression JavaScript valide qui apparaît à la position d'un argument dans la déclaration d'une fonction. Cela signifie que dans les environnements qui la supportent, vous pouvez utiliser une expression de destructuration dans l'expression. Remplace [`scope`](#scope-replaced) dans la 2.5.0+.
2305-
2306-
Cet attribut ne supporte pas les liaisons dynamiques.
2307-
2308-
- **Voir aussi :** [Slots avec portée](../guide/components.html#Slots-avec-portee)
2309-
2310-
### scope <sup>replaced</sup>
2311-
2312-
Used to denote a `<template>` element as a scoped slot, which is replaced by [`slot-scope`](#slot-scope) in 2.5.0+.
2313-
2314-
- **Usage:**
2315-
2316-
Same as [`slot-scope`](#slot-scope) except that `scope` can only be used on `<template>` elements.
2317-
23182399
### is
23192400

23202401
- **Attend comme valeur :** `string | Object (un objet d'options de composant)`
@@ -2340,6 +2421,40 @@ Used to denote a `<template>` element as a scoped slot, which is replaced by [`s
23402421
- [Composants dynamiques](../guide/components.html#Composants-dynamiques)
23412422
- [Limitations de l’analyse d’un template à partir du DOM](../guide/components.html#Limitations-de-l’analyse-d’un-template-a-partir-du-DOM)
23422423

2424+
### $todo slot <sup style="color:#c92222">deprecated</sup>
2425+
2426+
**Prefer [v-slot](#v-slot) in 2.6.0+.**
2427+
2428+
- **Expects:** `string`
2429+
2430+
Used on content inserted into child components to indicate which named slot the content belongs to.
2431+
2432+
- **See also:** [Named Slots with `slot`](../guide/components.html#Named-Slots-with-slot)
2433+
2434+
### slot-scope <sup style="color:#c92222">déprécié</sup>
2435+
2436+
**Prefer [v-slot](#v-slot) in 2.6.0+.**
2437+
2438+
- **Attend comme valeur :** `function argument expression`
2439+
2440+
- **Utilisation :**
2441+
2442+
Utilisé pour indiquer qu'un élément ou un composant a un slot avec portée. La valeur de l'attribut doit être une expression JavaScript valide qui apparaît à la position d'un argument dans la déclaration d'une fonction. Cela signifie que dans les environnements qui la supportent, vous pouvez utiliser une expression de destructuration dans l'expression. Remplace [`scope`](#scope-replaced) dans la 2.5.0+.
2443+
2444+
Cet attribut ne supporte pas les liaisons dynamiques.
2445+
2446+
- **Voir aussi :** [Slots avec portée with `slot-scope`](../guide/components.html#Slots-avec-portee)
2447+
2448+
### $todo scope <sup style="color:#c92222">removed</sup>
2449+
2450+
**Replaced by [slot-scope](#slot-scope) in 2.5.0+. Prefer [v-slot](#v-slot) in 2.6.0+.**
2451+
2452+
Used to denote a `<template>` element as a scoped slot.
2453+
2454+
- **Usage:**
2455+
2456+
Same as [`slot-scope`](#slot-scope) except that `scope` can only be used on `<template>` elements.
2457+
23432458
## Composants intégrés par défaut
23442459

23452460
### component

src/v2/cookbook/debugging-in-vscode.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ Click on the Debugging icon in the Activity Bar to bring up the Debug view, then
5757
"webRoot": "${workspaceFolder}/src",
5858
"breakOnLoad": true,
5959
"sourceMapPathOverrides": {
60-
"webpack:///src/*": "${webRoot}/*"
60+
"webpack:///./src/*": "${webRoot}/*"
6161
}
6262
},
6363
{

src/v2/cookbook/serverless-blog.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -297,7 +297,7 @@ created() {
297297

298298
## Pattern alternatif
299299

300-
Une alternative à considérer, surtout si vous préférez écrire seulement en Markdown, est d'utiliser par exemple [Nuxtent](https://nuxtent.now.sh/guide/writing#async-components). Nuxtent vous permet d'utiliser un composant Vue à l'intérieur de fichiers Markdown. Cette approche pourrait être apparentée à celle utilisée par les sites statiques (c'est-à-dire Jekyll) dans laquelle vous écrivez les articles dans des fichiers Markdown. Nuxtent permet une bonne intégration entre Vue.js et Markdown vous permettant de vivre dans un monde à 100% Vue.js.
300+
Une alternative à considérer, surtout si vous préférez écrire seulement en Markdown, est d'utiliser par exemple [Nuxtent](https://nuxtent-module.netlify.com/guide/writing/#async-components). Nuxtent vous permet d'utiliser un `Vue Component` à l'intérieur de fichiers Markdown. Cette approche pourrait être apparentée à celle utilisée par les sites statiques (c'est-à-dire Jekyll) dans laquelle vous écrivez les articles dans des fichiers Markdown. Nuxtent permet une bonne intégration entre Vue.js et Markdown vous permettant de vivre dans un monde à 100% Vue.js.
301301

302302
## Conclusion
303303

src/v2/examples/grid-component.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,4 +6,4 @@ order: 3
66

77
> Ceci est un exemple de création d'un composant tableau réutilisable et utilisant des données externes.
88
9-
<iframe width="100%" height="500" src="https://jsfiddle.net/yyx990803/xkkbfL3L/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>
9+
<iframe width="100%" height="500" src="https://jsfiddle.net/Tertia/vbyon64p/6/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

0 commit comments

Comments
 (0)