Traduction list.md #31

MachinisteWeb · 2017-02-23T16:12:17Z

À vos revus ! Comme d'hab avec moi y a du boulot :s

yann-yinn · 2017-02-24T09:54:12Z

review en cours

yann-yinn

Bon boulot, c'est un plus gros morceau que ce que je croyais :-p

yann-yinn · 2017-02-24T09:19:58Z

src/v2/guide/list.md

 type: guide
 order: 8
 ---

 ## `v-for`

-<p class="tip">**Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vuejs.org).**</p>We can use the `v-for` directive to render a list of items based on an array. The `v-for` directive requires a special syntax in the form of `item in items`, where `items` is the source data array and `item` is an **alias** for the array element being iterated on:
+Nous pouvons utiliser la directive `v-for` pour faire le rendu d'une liste d'éléments au sein d'un tableau de données. La directive `v-for` utilise une syntaxe spécifique de la forme `item in items`, où `items` représente la source de donnée du tableau et où `item` est un **alias** représentant l'élément du tableau en cours d'itération :


[erreur] - Petite erreur de sens à mon avis
"faire le rendu d'une liste d'éléments en se basant sur un tableau"
"le tableau source des données"

yann-yinn · 2017-02-24T09:28:56Z

src/v2/guide/list.md


 ``` html
 <div v-for="item of items"></div>
 ```

 ### Template `v-for`

-Similar to template `v-if`, you can also use a `<template>` tag with `v-for` to render a block of multiple elements. For example:
+De la même manière qu'avec le template `v-if`, vous pouvez également utiliser la balise `<template>` avec `v-for` pour faire le rendu d'une structure contenant de multiples éléments. Par exemple :


[suggestion]
"le template de v-if"

Mais j'aime pas la tournure anglaise de base qui donne presque l'impression que v-if est un template alors qu'on parle de l'utilisation de la balise "template" dans un v-if.

pourquoi ne pas omettre le mot template :
De la même manière qu'avec v-if, vous pouvez également utiliser la balise <template>

Ça fait sens car pour v-for il n'ont pas précisé le mot template, ça se comprend aisément, et pas d’ambiguïté avec <template> .

@forresst @haeresis ça me semble plus clair, c'est peut être une suggestion à remonter sur la doc anglaise ?

Je ne sais pas si c'est une particularité de l'anglais. Je veux dire défois on a « La ville où j'ai vécu et où j'ai grandi » là ou en anglais ils ont « The town where I lived and grown » (pas de répétition de où). C'est p-e pareil avec « template » ? Sinon à signaler !

yann-yinn · 2017-02-24T09:32:24Z

src/v2/guide/list.md


-> This section assumes knowledge of [Components](components.html). Feel free to skip it and come back later.
+> Cette partie suppose que vous ayez pris connaissance du contenu de [Composants](components.html). Vous pouvez la passer pour le moment et y revenir plus tard.


[suggestion] (plus direct et proche de l'original)
"... suppose que vous connaissez les Composants"

Hors sujet, pour mon information :

Vous savez ce que la phrase aurait donnée en anglais si on avait utilisez pour traduire « que vous connaissiez » ? Sous entendu que vous les connaissiez avant de lire la suite. Ma question, je crois, c'est surtout est ce que les modes indicatif/subjonctif et conditionnel existent en anglais ?

yann-yinn · 2017-02-24T09:39:05Z

src/v2/guide/list.md


-You can directly use `v-for` on a custom component, like any normal element:
+Vous pouvez directement utiliser `v-for` sur un composant personnalisé, comme sur n'importe quel autre élément standard :


[suggestion]
pourquoi standard ?
"comme sur n'importe quel autre élément normal"

Arf, j'ai horreur du mot « normal ».

Ça veut tellement rien dire que si je ne le mettais pas, ça changerait rien à la phrase.

Surement un reste de mes cours de philo.

L'une des traductions possible est standard « http://www.linguee.fr/francais-anglais/search?source=auto&query=normal ».

Mais très clairement là c'est un goût personnel. Je préfère « standard » quand je parle des « normes » parce que « normal » me fait trop pensé que son opposé est « anormal » ou « bizarre ». Je sais pas si y a cette notion là en anglais ? Encore un avis positif pour le « normal » et je le remet haha :D

@haeresis ok. Pour moi "standard" en informatique à aussi un arrière-goût de RFC ou norme ISO, bref l'idée de se conformer strictement à une norme. (genre : https://www.w3.org/TR/html5/ ) Ici on veut juste faire passer l'idée de "n'importe quel élément" (sans rien ça marche) ou d'un élément "lambda". Perso je préfère rien à standard; mais c'est un point mineur non-bloquant en ce qui me concerne

Viens, on est des dingues, on le fait péter ! :D

yann-yinn · 2017-02-24T09:42:27Z

src/v2/guide/list.md


 ``` html
 <my-component v-for="item in items"></my-component>
 ```

-However, this won't automatically pass any data to the component, because components have isolated scopes of their own. In order to pass the iterated data into the component, we should also use props:
+Cependant, cela ne passera pas automatiquement les données au composant, et cela car les composants ont leurs propres portées isolées. Dans l'optique de passer les données itérées au composant, nous devons utiliser les props conjointement :


[suggestion] ( plus direct et proche de l'original )
"et cela car" => "parce que les composants"
"Dans l'optique de passer les données itérées" => "Pour passer les données itérées"
"nous devons utiliser les props conjointement " => "nous devons aussi utiliser les props"

et cela car

J'avais mis car pour cette raison :

Elle doit être malade car je ne l'ai pas vu. (Ce n'est pas parce que je ne l'ai pas vu, qu'elle est malade !) =donc=> Elle doit être malade parce que je ne l'ai pas vu.

Ici on a

C'est pas passé au composant car ils ont leurs portées (C'est parce qu'ils ont leur propre porté isolé qu'on les passes) =donc=>Je gardais « car ».

Mais ok pour pour moi ! C'est plus « jolie » à lire haha.

Pour « nous devons aussi utiliser les props » j'ai un soucis car pour moi le mot aussi signifie plutôt « too » dans le sens ou : « On a déjà passé les props pour faire un truc, et donc pour itérées sur les composants on doit aussi les utilisers ».

Là c'est pas le cas, là c'est also dans le sens « on doit utiliser ce truc en plus » donc j'avais pensé à ça

nous devons utiliser les props en plus

Mais bof bof. Je vais mettre « en plus » car c'est vrai que conjointement est éloigné de l'original même si c'est exactement ce que ça veut dire.

@haeresis ok, tu accentues l'idée, perso ça me semble déjà clair avec le mot "aussi" puisque aussi a également un sens de "addition / en plus" en français (comme le "too" en anglais d'ailleurs) . D'une manière générale je traduis au plus près du texte et concis pour avoir un cap précis pendant la trad.

yann-yinn · 2017-02-24T10:49:34Z

src/v2/guide/list.md


 ``` js
 example1.items = example1.items.filter(function (item) {
  return item.message.match(/Foo/)
 })
 ```

-You might think this will cause Vue to throw away the existing DOM and re-render the entire list - luckily, that is not the case. Vue implements some smart heuristics to maximize DOM element reuse, so replacing an array with another array containing overlapping objects is a very efficient operation.
+Vous pouvez penser que cela va forcer Vue à jeter le DOM existant et à faire le rendu de nouveau sur la liste entière ? Par chance, cela n'est pas le cas. Vue implémente plusieurs fonctions heuristiques intelligentes pour optimiser la réutilisation du DOM existant ; ainsi remplacer un tableau par un autre contenant des objets supplémentaires est une opération vraiment efficace.


[suggestion]
vraiment efficace => très performante ( c'est comme ça que tu l'as traduit plus haut)

yann-yinn · 2017-02-24T10:51:37Z

src/v2/guide/list.md


-Due to limitations in JavaScript, Vue **cannot** detect the following changes to an array:
+A cause de limitations de JavaScript, Vue **ne peut pas** détecter les changements suivants dans un tableau :


[faute | suggestion]
A cause des limitations en JavaScript

Je vais mettre « du » pour « À cause des limitations du langage JavaScript ». Désolé de l'avoir « Personnifié », je l'aime tellement <3

yann-yinn · 2017-02-24T10:56:34Z

src/v2/guide/list.md


-To overcome caveat 1, both of the following will accomplish the same as `vm.items[indexOfItem] = newValue`, but will also trigger state updates in the reactivity system:
+Pour contourner la première exception, les deux exemples suivant accomplissent la même chose que `vm.items[indexOfItem] = newValue`, mais vont également déclencher des mises à jour d'états dans le système réactif :


[suggestion]
"exception" = >"limitation" ou "souci"

Exception n'est pas assez péjoratif à mon avis, on parle bien ainsi d'un piège à éviter voire d'une fourberie qui peut faire perdre 3 heures de développement à quelqu'un qui ignore cette limitation :D

T'as raison, j'hésitais entre

Mais Putain !

et

Exceptions

Je pense que

Limitations

C'est mieux XD

yann-yinn · 2017-02-24T10:57:19Z

src/v2/guide/list.md

@@ -415,17 +415,17 @@ Vue.set(example1.items, indexOfItem, newValue)
 example1.items.splice(indexOfItem, 1, newValue)
 ```

-To deal with caveat 2, you can also use `splice`:
+Pour régler la seconde exception, vous pouvez également utiliser `splice` :


[suggestion]
Pour gérer la deuxième limitation

Pour gérer la seconde limitation

Je maintiens juste seconde.

En français on est censé dire : seconde s'il n'y a pas de troisième, deuxième si il y a un troisième.

http://www.carriereonline.com/e/orthographe---quelle-est-la-difference-entre-deuxieme-et-second--.html

Donc si tu dis à ton mome : « Attention, c'est la seconde fois que je le répète », bah il est sencé comprendre que c'est la dernière 😋

yann-yinn · 2017-02-24T10:58:22Z

src/v2/guide/list.md


-Sometimes we want to display a filtered or sorted version of an array without actually mutating or resetting the original data. In this case, you can create a computed property that returns the filtered or sorted array.
+Parfois nous voulons afficher une version filtrée ou triée d'un tableau sans pour autant transformer ou effacer les données originales. Dans ce cas, vous pouvez créer une propriété calculée qui retourne le tableau filtré ou trié.


[a debattre]
voir https://github.com/vuejs-fr/vuejs.org/pull/31/files#r102918976

J'ai donc mis « changer » par concordance et pour la clarté du lecteur français. Je pourrai aussi mettre « mute, muttent, etc. » et mettre entre parenthèse (change les mêmes valeurs) ou un truc du genre entre parenthèse à la première occurrence. J'ai cependant bien garder le terme « Méthode de mutation » qui est important.

forresst

Quelques remarques, mais @nyl-auster a déjà commenté pas mal de point que j'approuve

forresst · 2017-02-24T17:18:29Z

src/v2/guide/list.md


 ``` html
 <div v-for="item of items"></div>
 ```

 ### Template `v-for`

-Similar to template `v-if`, you can also use a `<template>` tag with `v-for` to render a block of multiple elements. For example:
+De la même manière qu'avec le template `v-if`, vous pouvez également utiliser la balise `<template>` avec `v-for` pour faire le rendu d'une structure contenant de multiples éléments. Par exemple :


pourquoi ne pas omettre le mot template :
De la même manière qu'avec v-if, vous pouvez également utiliser la balise <template>

forresst · 2017-02-24T17:24:17Z

src/v2/guide/list.md


 ``` html
 <div v-for="(value, key, index) in object">
  {{ index }}. {{ key }} : {{ value }}
 </div>
 ```

-<p class="tip">When iterating over an object, the order is based on the key enumeration order of `Object.keys()`, which is **not** guaranteed to be consistent across JavaScript engine implementations.</p>
+<p class="tip">Quand vous itérez sur un objet, l'ordre est basé sur l'ordre d'énumération de `Object.keys()` et il **n'**y a **aucune** garantie de consistance à travers toutes les implémentations des moteurs JavaScript.</p>


[suggestion]
Quand vous itérez sur un objet, l'ordre est basé sur l'ordre d'énumération de clé de Object.keys() et il n'y a aucune garantie de cohérence dans l’ensemble des implémentations de moteur JavaScript.

Bon pour moi :)

forresst · 2017-02-24T17:29:01Z

src/v2/guide/list.md


-### Range `v-for`


Range exprime plutôt une période, une plage. J'avoue que j'ai du mal à trouvé une meilleure traduction pour l'instant...

@forresst @haeresis "série" ?

Série me plait bien

forresst · 2017-02-24T17:33:08Z

src/v2/guide/list.md

-      'Take out the trash',
-      'Mow the lawn'
+      'Faire la vaisselle',
+      'Sortir les poubelles',


J'ai le même problème

forresst · 2017-02-24T21:24:42Z

src/v2/guide/list.md

@@ -353,27 +353,27 @@ If instead, your intent is to conditionally skip execution of the loop, you can

 ## `key`

-When Vue is updating a list of elements rendered with `v-for`, it by default uses an "in-place patch" strategy. If the order of the data items has changed, instead of moving the DOM elements to match the order of the items, Vue will simply patch each element in-place and make sure it reflects what should be rendered at that particular index. This is similar to the behavior of `track-by="$index"` in Vue 1.x.
+Quand Vue met à jour une liste d'éléments rendus avec `v-for`, il utilise par défaut une stratégie de « in-place patch ». Si l'ordre des éléments de données a changé, plutôt que de déplacer les éléments du DOM pour concorder avec le nouvel ordre des éléments, Vue va simplement changer chaque élément en place et s'assurer que cela reflète ce qui aurait dû être rendu à cet index en particulier. Cela est un comportement similaire au `track-by="$index"` de Vue 1.x.


Je traduirais « in-place patch » par « correctif sur place »

forresst · 2017-02-24T21:33:55Z

src/v2/guide/list.md


-To give Vue a hint so that it can track each node's identity, and thus reuse and reorder existing elements, you need to provide a unique `key` attribute for each item. An ideal value for `key` would be the unique id of each item. This special attribute is a rough equivalent to `track-by` in 1.x, but it works like an attribute, so you need to use `v-bind` to bind it to dynamic values (using shorthand here):
+Pour donner à Vue un indice pour permettre à chaque nœud d'être correctement identifié et suivi afin que les élément existant puissent être réutilisés et réordonnés, vous devez fournir une `key` (clé) d'attribut unique pour chaque élément. Une valeur idéale pour `key` serait l'identifiant `id` unique de chaque élément. Cet attribut spécial est en gros l'équivalent du `track-by` de la 1.x, mais il fonctionne comme un attribut, donc vous avez besoin d'utiliser `v-bind` pour le lier aux valeurs dynamiques (un exemple avec l'abréviation de `v-bind`) :


[suggestion]
Pour donner un indice à Vue afin qu'il puisse suivre l'identité de chaque nœud, et ainsi réutiliser et réorganiser les éléments existants, vous devez fournir un attribut unique key (clé) pour chaque élément.

forresst · 2017-02-24T21:47:42Z

src/v2/guide/list.md


-### Replacing an Array
+### Remplacer un tableau


Remplacement d'un tableau

forresst · 2017-02-24T21:50:43Z

src/v2/guide/list.md


-Mutation methods, as the name suggests, mutate the original array they are called on. In comparison, there are also non-mutating methods, e.g. `filter()`, `concat()` and `slice()`, which do not mutate the original Array but **always return a new array**. When working with non-mutating methods, you can just replace the old array with the new one:
+Les méthodes transformantes, comme le nom le suggère, transforment le tableau original sur lesquelles elles sont appelées. En comparaison, il y a aussi des méthodes non transformantes, ex. : `filter()`, `concat()` et `slice()`, qui ne transforment pas le tableau original mais **retourne toujours un nouveau tableau**. Quand vous travaillez avec des méthodes non transformantes, vous pouvez juste remplacer l'ancien tableau par le nouveau :


Personnellement, je préfère "Les méthodes de mutation"

MachinisteWeb · 2017-02-25T10:27:18Z

Ok. J'ai pris les suggestions et mélangés vos idées ! Merci. Je vous laisse donnés vos retours.

sylvainpolletvillard

1ère relecture, très peu de fautes bien joué ;)

sylvainpolletvillard · 2017-02-25T18:50:56Z

src/v2/guide/list.md


-`v-for` can also take an integer. In this case it will repeat the template that many times.
+`v-for` peut également prendre un nombre. Dans ce cas, il répétera le template autant de fois qu'indiqué.


préciser "nombre entier" pour traduire "integer"

sylvainpolletvillard · 2017-02-25T18:55:34Z

src/v2/guide/list.md


-Here's a complete example of a simple todo list:
+Voici un exemple complet d'une liste de tâches simple :


une simple liste de tâches

À la base j'avais traduit par : une simple liste de tâches (sous-entendu « un exemple complet fournit simplement avec cette liste de tâches » )

@nyl-auster m'a plutôt indiquer de traduire ça par : une liste de tâches simple (sous-entendu « une liste de tâche dont la difficulté est sur « facile »)

Du coup c'est quoi le sens exacte ?

si ce sont les tâches qui sont simples, alors c'est un pluriel. Mais je doute fortement qu'il s'agisse des tâches ici, il parle de la liste entière.

il faut bien comprendre "une todo-list simple". (au singulier)
du coup "simple liste de tâches" ou "liste de tâches simple" ça revient un peu au même, même si pour ma part je trouve plus naturel de mettre l'adjectif à la fin (ex : "une liste de tâches complexe" plutôt qu'une "complexe liste de tâches". Les deux sont compréhensibles pour moi pour peu qu'on conjugue simple avec liste :-p

Je vais mettre « petite ». Pourquoi elle est simple ? Parce qu'il y a 3 items qui se cours après. Cependant le fait qu'une « liste » soit simple c'est un peu con. On a soit liste de tâches simples (les tâches sont simple, mais là les tâches sont relou) soit finalement dire qu'elle est petite.

Simple liste ou liste simple ? C'est la même nuance entre un homme grand et un grand homme, ou entre une histoire drôle et une drôle d'histoire 😄

Tout dépend de l'interprétation en fait. S'il veut dire "C'est juste une liste de tâches, sans frioritures", alors c'est "simple liste". S'il veut dire "C'est une liste de tâches dont le fonctionnement est simple", alors c'est "liste simple". Cette nuance n'existe pas en anglais donc on peut l'interpréter de deux façons différentes.

euh pourquoi "petite" ? Autant avant on pouvait douter de l'interprétation, autant là on change clairement de sens. J'aurais préféré retirer ma remarque et garder l'interprétation de @nyl-auster

@haeresis elle est simple au sens où elle ne contient aucune complexité et qu'elle est facile à comprendre; ce serait pareil avec 1000 tâches concernant un v-for ;)

sylvainpolletvillard · 2017-02-25T18:57:06Z

src/v2/guide/list.md

-      'Take out the trash',
-      'Mow the lawn'
+      'Faire la vaisselle',
+      'Sortir les poubelles',


Mais j'ai pas le temps de les faire car je dois coder des Todolist

sylvainpolletvillard · 2017-02-25T19:08:05Z

src/v2/guide/list.md

@@ -353,27 +353,27 @@ If instead, your intent is to conditionally skip execution of the loop, you can

 ## `key`

-When Vue is updating a list of elements rendered with `v-for`, it by default uses an "in-place patch" strategy. If the order of the data items has changed, instead of moving the DOM elements to match the order of the items, Vue will simply patch each element in-place and make sure it reflects what should be rendered at that particular index. This is similar to the behavior of `track-by="$index"` in Vue 1.x.
+Quand Vue met à jour une liste d'éléments rendus avec `v-for`, il utilise par défaut une stratégie de « modification localisée » (*in-place patch*). Si l'ordre des éléments de données a changé, plutôt que de déplacer les éléments du DOM pour concorder avec le nouvel ordre des éléments, Vue va simplement changer chaque élément en place et s'assurer que cela reflète ce qui aurait dû être rendu à cet index en particulier. Cela est un comportement similaire au `track-by="$index"` de Vue 1.x.


ici je mettrai "éléments data" ou "éléments en data" pour faire le parallèle avec la propriété data. "élément de donnée" fait penser à un fragment de donnée, ce qui n'est pas le sens désiré.

et "modifier (ou "patcher") chaque élément déjà en place" ; pour éviter la confusion avec "changer de place" qui est précisément ce que Vue ne fait pas.

"C'est" au lieu de "Cela est"

sylvainpolletvillard · 2017-02-25T19:10:14Z

src/v2/guide/list.md


-This default mode is efficient, but only suitable **when your list render output does not rely on child component state or temporary DOM state (e.g. form input values)**.
+Ce mode par défaut est performant, mais seulement envisageable **quand le résultat du rendu de votre liste n'est pas lié à l'état d'un composant enfant ou à l'état temporaire du DOM (ex. : les valeurs de champs d'un formulaire)**.


mais adapté seulement lorsque

ne dépend pas de l'état d'un composant enfant ou de l'état temporaire du DOM

sylvainpolletvillard · 2017-02-25T19:26:41Z

src/v2/guide/list.md


 ``` js
 example1.items = example1.items.filter(function (item) {
  return item.message.match(/Foo/)
 })
 ```

-You might think this will cause Vue to throw away the existing DOM and re-render the entire list - luckily, that is not the case. Vue implements some smart heuristics to maximize DOM element reuse, so replacing an array with another array containing overlapping objects is a very efficient operation.
+Vous pouvez penser que cela va forcer Vue à jeter le DOM existant et à faire le rendu de nouveau sur la liste entière ? Par chance, cela n'est pas le cas. Vue implémente plusieurs fonctions heuristiques intelligentes pour optimiser la réutilisation du DOM existant ; ainsi remplacer un tableau par un autre contenant des objets supplémentaires est une opération très performante.


"à refaire le rendu" (ou "à faire de nouveau le rendu") "de la liste entière"

pour maximiser la réutilisation

contenant des objets qui se chevauchent (pas content de cette traduction mais en tout cas ce ne sont pas les supplémentaires, il parle bien ici des index en conflit ; je suis ouvert à d'autres suggestions)

Bien vu. "objets qui se recoupent " ? Vu l'exemple, je crois comprendre que Vuejs regarde ce qu'il y a en commun puis applique la diff.

sylvainpolletvillard · 2017-02-25T19:27:28Z

src/v2/guide/list.md


-Due to limitations in JavaScript, Vue **cannot** detect the following changes to an array:
+À cause des limitations du JavaScript, Vue **ne peut pas** détecter les changements suivants dans un tableau :


"dans" ou "de" JavaScript

Initialement « de », j'ai changé en faveur de « du » et non en faveur de « en »

« du » pour « À case des limitations du (langage) JavaScript »

dans ce cas rajouter le mot "langage", sinon c'est paradoxalement un abus de langage

Je repars sur la proposition de @nyl-auster « en » (je crois) pour faire comme la doc MDN (https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide/Expressions_et_Op%C3%A9rateurs)

sylvainpolletvillard · 2017-02-25T19:28:25Z

src/v2/guide/list.md


-To overcome caveat 1, both of the following will accomplish the same as `vm.items[indexOfItem] = newValue`, but will also trigger state updates in the reactivity system:
+Pour contourner la première limitation, les deux exemples suivant accomplissent la même chose que `vm.items[indexOfItem] = newValue`, mais vont également déclencher des mises à jour d'états dans le système réactif :


suivants

des mises à jour de l'état

le système de réactivité

sylvainpolletvillard · 2017-02-25T19:28:57Z

src/v2/guide/list.md


 ``` js
 example1.items.splice(newLength)
 ```

-## Displaying Filtered/Sorted Results
+## Affichage de résultats filtrés/triés


Afficher des résultats filtrés/triés

Je conserve une traduction au plus proche de « Displaying »

les deux traductions sont valables, en anglais de nombreux verbes ne font pas la différence entre le participe présent et le nom associé (exemple: the growing / growing). On peut garder la tienne, c'est une question de préférences.

sylvainpolletvillard · 2017-02-25T19:29:47Z

src/v2/guide/list.md


-Sometimes we want to display a filtered or sorted version of an array without actually mutating or resetting the original data. In this case, you can create a computed property that returns the filtered or sorted array.
+Parfois nous voulons afficher une version filtrée ou triée d'un tableau sans pour autant changer ou effacer les données originales. Dans ce cas, vous pouvez créer une propriété calculée qui retourne le tableau filtré ou trié.


sans pour autant modifier ou réassigner les données d'origine.

MachinisteWeb · 2017-02-27T17:22:37Z

src/v2/guide/list.md


 ``` js
 example1.items = example1.items.filter(function (item) {
  return item.message.match(/Foo/)
 })
 ```

-You might think this will cause Vue to throw away the existing DOM and re-render the entire list - luckily, that is not the case. Vue implements some smart heuristics to maximize DOM element reuse, so replacing an array with another array containing overlapping objects is a very efficient operation.
+Vous pouvez penser que cela va forcer Vue à jeter le DOM existant et à faire de nouveau le rendu de la liste entière ? Par chance, cela n'est pas le cas. Vue implémente plusieurs fonctions heuristiques intelligentes pour maximiser la réutilisation du DOM existant ; ainsi remplacer un tableau par un autre partiellement modifié (objets différents pour certains index) est une opération très performante.


J'ai mis ça pour « ainsi remplacer un tableau par un autre partiellement modifié (objets différents pour certains index) est une opération très performante. » mais en fait on pourrait presque viré la parenthèse car je trouve que un tableau par un autre partiellement modifié (ou p-e par un autre partiellement identique ?) explique l'idée. Non ?

"Partiellement modifié" donne l'impression qu'on mute l'objet en gardant la référence, or ce n'est pas le cas ici. Que penses-tu de:
"ainsi remplacer un tableau par un autre contenant des objets différents à certains index est une opération très performante."

Bon pour moi !

https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide/Expressions_et_Op%C3%A9rateurs

yann-yinn · 2017-02-27T18:05:47Z

Beau boulot collectif, la traduction est chouette. A noter que désormais "key" est obligatoire quand on utilise v-for depuis la toute dernière version de vuejs, mais je crois que la doc anglaise n'a pas été modifiée en conséquence : https://github.com/vuejs/vue/releases/tag/v2.2.0

MachinisteWeb · 2017-02-27T18:12:41Z

Bien Vue pour 🔑 . Nous ferrons la MàJ quand il la feront.

MachinisteWeb · 2017-03-01T11:19:38Z

J'ai remis simple, et je les remis devant. Bon pour validation @sylvainpolletvillard ?

French translation

47fddbc

MachinisteWeb changed the title ~~French translation~~ Traduction list.md Feb 23, 2017

MachinisteWeb self-assigned this Feb 23, 2017

MachinisteWeb requested review from forresst, yann-yinn and sylvainpolletvillard February 23, 2017 16:13

MachinisteWeb mentioned this pull request Feb 23, 2017

Pages en cours de traduction #3

Open

yann-yinn suggested changes Feb 24, 2017

View reviewed changes

forresst requested changes Feb 24, 2017

View reviewed changes

MachinisteWeb added 3 commits February 25, 2017 11:22

Retour de nyl-auster et forresst pris en compte

e237212

Exception => Limitation

fcf4986

Consistence => Cohérence

a338c99

forresst approved these changes Feb 25, 2017

View reviewed changes

sylvainpolletvillard requested changes Feb 25, 2017

View reviewed changes

Inclusion des dernières propositions/corrections

c4e2f70

MachinisteWeb commented Feb 27, 2017

View reviewed changes

MachinisteWeb added 2 commits February 27, 2017 18:25

« en » JavaScript pour éviter l'usage de langage

e967f57

https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide/Expressions_et_Op%C3%A9rateurs

Éclaircir le merge des tableaux dans data

0c62d2e

yann-yinn approved these changes Feb 27, 2017

View reviewed changes

petite plutôt que simple

674abd8

petite => simple

7d2d29c

sylvainpolletvillard approved these changes Mar 2, 2017

View reviewed changes

MachinisteWeb merged commit 5dc8689 into vuejs-fr:master Mar 2, 2017


		> This section assumes knowledge of [Components](components.html). Feel free to skip it and come back later.
		> Cette partie suppose que vous ayez pris connaissance du contenu de [Composants](components.html). Vous pouvez la passer pour le moment et y revenir plus tard.


		You can directly use `v-for` on a custom component, like any normal element:
		Vous pouvez directement utiliser `v-for` sur un composant personnalisé, comme sur n'importe quel autre élément standard :


		Due to limitations in JavaScript, Vue cannot detect the following changes to an array:
		A cause de limitations de JavaScript, Vue ne peut pas détecter les changements suivants dans un tableau :


		To overcome caveat 1, both of the following will accomplish the same as `vm.items[indexOfItem] = newValue`, but will also trigger state updates in the reactivity system:
		Pour contourner la première exception, les deux exemples suivant accomplissent la même chose que `vm.items[indexOfItem] = newValue`, mais vont également déclencher des mises à jour d'états dans le système réactif :


		Sometimes we want to display a filtered or sorted version of an array without actually mutating or resetting the original data. In this case, you can create a computed property that returns the filtered or sorted array.
		Parfois nous voulons afficher une version filtrée ou triée d'un tableau sans pour autant transformer ou effacer les données originales. Dans ce cas, vous pouvez créer une propriété calculée qui retourne le tableau filtré ou trié.


		To give Vue a hint so that it can track each node's identity, and thus reuse and reorder existing elements, you need to provide a unique `key` attribute for each item. An ideal value for `key` would be the unique id of each item. This special attribute is a rough equivalent to `track-by` in 1.x, but it works like an attribute, so you need to use `v-bind` to bind it to dynamic values (using shorthand here):
		Pour donner à Vue un indice pour permettre à chaque nœud d'être correctement identifié et suivi afin que les élément existant puissent être réutilisés et réordonnés, vous devez fournir une `key` (clé) d'attribut unique pour chaque élément. Une valeur idéale pour `key` serait l'identifiant `id` unique de chaque élément. Cet attribut spécial est en gros l'équivalent du `track-by` de la 1.x, mais il fonctionne comme un attribut, donc vous avez besoin d'utiliser `v-bind` pour le lier aux valeurs dynamiques (un exemple avec l'abréviation de `v-bind`) :


		Mutation methods, as the name suggests, mutate the original array they are called on. In comparison, there are also non-mutating methods, e.g. `filter()`, `concat()` and `slice()`, which do not mutate the original Array but always return a new array. When working with non-mutating methods, you can just replace the old array with the new one:
		Les méthodes transformantes, comme le nom le suggère, transforment le tableau original sur lesquelles elles sont appelées. En comparaison, il y a aussi des méthodes non transformantes, ex. : `filter()`, `concat()` et `slice()`, qui ne transforment pas le tableau original mais retourne toujours un nouveau tableau. Quand vous travaillez avec des méthodes non transformantes, vous pouvez juste remplacer l'ancien tableau par le nouveau :


		`v-for` can also take an integer. In this case it will repeat the template that many times.
		`v-for` peut également prendre un nombre. Dans ce cas, il répétera le template autant de fois qu'indiqué.


		Here's a complete example of a simple todo list:
		Voici un exemple complet d'une liste de tâches simple :


		This default mode is efficient, but only suitable when your list render output does not rely on child component state or temporary DOM state (e.g. form input values).
		Ce mode par défaut est performant, mais seulement envisageable quand le résultat du rendu de votre liste n'est pas lié à l'état d'un composant enfant ou à l'état temporaire du DOM (ex. : les valeurs de champs d'un formulaire).


		Due to limitations in JavaScript, Vue cannot detect the following changes to an array:
		À cause des limitations du JavaScript, Vue ne peut pas détecter les changements suivants dans un tableau :


		To overcome caveat 1, both of the following will accomplish the same as `vm.items[indexOfItem] = newValue`, but will also trigger state updates in the reactivity system:
		Pour contourner la première limitation, les deux exemples suivant accomplissent la même chose que `vm.items[indexOfItem] = newValue`, mais vont également déclencher des mises à jour d'états dans le système réactif :

Traduction list.md #31

Traduction list.md #31

Conversation

MachinisteWeb commented Feb 23, 2017 • edited Loading

yann-yinn commented Feb 24, 2017

yann-yinn left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yann-yinn Feb 24, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yann-yinn Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yann-yinn Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

yann-yinn Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Mais Putain !

Exceptions

Limitations

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 25, 2017 • edited Loading

Choose a reason for hiding this comment

forresst left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb commented Feb 25, 2017 • edited Loading

sylvainpolletvillard left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb Feb 27, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MachinisteWeb commented Feb 23, 2017 •

edited

Loading

yann-yinn Feb 24, 2017 •

edited

Loading

yann-yinn Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

yann-yinn Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

yann-yinn Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 25, 2017 •

edited

Loading

MachinisteWeb commented Feb 25, 2017 •

edited

Loading

MachinisteWeb Feb 27, 2017 •

edited

Loading

sylvainpolletvillard Feb 27, 2017 •

edited

Loading

yann-yinn commented Feb 27, 2017 •

edited

Loading

MachinisteWeb commented Feb 27, 2017 •

edited

Loading