Skip to content

Commit be92aff

Browse files
committed
Correction d'après les remarques de Haeresis
1 parent 3e41491 commit be92aff

File tree

1 file changed

+12
-12
lines changed

1 file changed

+12
-12
lines changed

src/v2/guide/computed.md

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ order: 5
66

77
## Propriétés calculées
88

9-
Les expressions dans le template sont très pratiques, mais elles sont uniquement destinées pour des opérations simples. Mettre trop de logique dans vos templates, cela peut les rendre trop verbeux et difficiles à maintenir. Par exemple :
9+
Les expressions dans le template sont très pratiques, mais elles sont uniquement destinées pour des opérations simples. Mettre trop de logique dans vos templates peut les rendre trop verbeux et difficiles à maintenir. Par exemple :
1010

1111
``` html
1212
<div id="example">
@@ -16,7 +16,7 @@ Les expressions dans le template sont très pratiques, mais elles sont uniquemen
1616

1717
À cet endroit, le template n'est ni simple, ni déclaratif. Vous devez le regarder pendant une seconde avant de réaliser qu'il affiche `message` dans le sens inverse. Le problème s'aggrave lorsque vous souhaitez inclure le message inversé plusieurs fois dans votre template.
1818

19-
C'est pourquoi pour des logiques complexes, vous devriez utiliser des **propriétés calculées**.
19+
C'est pourquoi vous devriez utiliser des **propriétés calculées** pour des logiques complexes.
2020

2121
### Exemple basique
2222

@@ -31,7 +31,7 @@ C'est pourquoi pour des logiques complexes, vous devriez utiliser des **proprié
3131
var vm = new Vue({
3232
el: '#example',
3333
data: {
34-
message: 'Hello'
34+
message: 'Bonjour'
3535
},
3636
computed: {
3737
// un accesseur calculé
@@ -54,7 +54,7 @@ Résultat :
5454
var vm = new Vue({
5555
el: '#example',
5656
data: {
57-
message: 'Hello'
57+
message: 'Bonjour'
5858
},
5959
computed: {
6060
reversedMessage: function () {
@@ -68,14 +68,14 @@ var vm = new Vue({
6868
Ici, nous avons déclaré une propriété calculée `reversedMessage`. La fonction que nous avons fournie sera utilisée comme une fonction accesseur (getter) pour la propriété `vm.reversedMessage` :
6969

7070
``` js
71-
console.log(vm.reversedMessage) // -> 'olleH'
72-
vm.message = 'Goodbye'
73-
console.log(vm.reversedMessage) // -> 'eybdooG'
71+
console.log(vm.reversedMessage) // -> 'ruojnoB'
72+
vm.message = 'Au revoir'
73+
console.log(vm.reversedMessage) // -> 'riover uA'
7474
```
7575

7676
Vous pouvez ouvrir la console et jouer vous-même avec l'exemple de vm. La valeur de `vm.reversedMessage` dépend toujours de la valeur de `vm.message`.
7777

78-
Vous pouvez lier des données aux propriétés calculées dans les templates comme une propriété normale. Vue est au courant que `vm.reversedMessage` dépend de `vm.message`, donc il mettra à jour toutes les liaisons qui dépendent de `vm.reversedMessage` lorsque `vm.message` changera. Et la meilleure chose, c'est que nous avons créé cette relation de dépendance de façon déclarative : la fonction de l'accesseur calculé n'a pas d'effets secondaires, ce qui la rend facile à tester et à raisonner.
78+
Vous pouvez lier des données aux propriétés calculées dans les templates comme une propriété normale. Vue est au courant que `vm.reversedMessage` dépend de `vm.message`, donc il mettra à jour toutes les liaisons qui dépendent de `vm.reversedMessage` lorsque `vm.message` changera. Et ce qui est encore mieux c'est que nous avons crée cette relation de dépendance de façon déclarative : la fonction de l'accesseur calculé n'a pas d'effets secondaires, ce qui la rend facile à tester et à raisonner.
7979

8080
### Mise en cache dans `computed` vs `methods`
8181

@@ -108,11 +108,11 @@ computed: {
108108

109109
En comparaison, une invocation de méthode exécutera **toujours** la fonction à chaque fois que se produira un re-déclenchement du rendu.
110110

111-
Pourquoi avons-nous besoin de mettre en cache ? Imaginez que nous avons une propriété calculée couteuse **A**, qui exige une boucle dans un énorme tableau et fait beaucoup de calculs. Alors nous pouvons avoir d’autres propriétés calculées qui dépendent à leur tour de **A**. Sans la mise en cache, nous exécuterions l'accesseur de **A** autant de fois que nécessaire ! Dans les cas où vous ne souhaitez pas la mise en cache, utilisez une méthode à la place.
111+
Pourquoi avons-nous besoin de mettre en cache ? Imaginez que nous avons une propriété calculée couteuse **A**, qui exige une boucle dans un énorme tableau et qui fait beaucoup de calculs. Alors nous pouvons avoir d’autres propriétés calculées qui dépendent à leur tour de **A**. Sans la mise en cache, nous exécuterions l'accesseur de **A** autant de fois que nécessaire ! Dans les cas où vous ne souhaitez pas la mise en cache, utilisez une méthode à la place.
112112

113113
### Propriétés calculées vs observées
114114

115-
Vue fournit vraiment une façon plus générique d'observer et de réagir aux changements de données sur une instance de Vue : **les propriétés watch**. Quand vous avez des données qu’il faut changer basées sur d’autres données, il est tentant d’abuser de `watch` (surtout si vous venez du monde d'AngularJS). Toutefois, il est souvent préférable d’utiliser une propriété calculée et pas une fonction impérative de retour de `watch`. Considérez cet exemple :
115+
Vue fournit vraiment une façon plus générique d'observer et de réagir aux changements de données sur une instance de Vue : **les propriétés watch**. Quand vous avez des données qu’il faut changer basées sur d’autres données, il est tentant d’abuser de `watch` (surtout si vous venez du monde d'AngularJS). Toutefois, il est souvent préférable d’utiliser une propriété calculée et pas une fonction de retour impérative de `watch`. Considérez cet exemple :
116116

117117
``` html
118118
<div id="demo">{{ fullName }}</div>
@@ -158,7 +158,7 @@ C'est mieux, n'est-ce pas ?
158158

159159
### Mutateur calculé
160160

161-
Les propriétés calculées ont par défaut un accesseur uniquement, mais vous pouvez également fournir un mutateur (setter) quand vous en avez besoin :
161+
Les propriétés calculées ont par défaut uniquement un accesseur, mais vous pouvez également fournir un mutateur (setter) quand vous en avez besoin :
162162

163163
``` js
164164
// ...
@@ -183,7 +183,7 @@ Maintenant, lorsque vous exécutez `vm.fullName = 'John Doe'`, le mutateur sera
183183

184184
## Observateurs
185185

186-
Bien que les propriétés calculées sont plus appropriées dans la plupart des cas, parfois un observateur personnalisé est nécessaire. C'est pour cela que Vue fournit une façon plus générique de réagir aux changements de données à travers l'option `watch`. Ceci est très utile lorsque vous souhaitez exécuter des opérations asynchrones ou coûteuses en réponse aux données changeantes.
186+
Bien que les propriétés calculées soient plus appropriées dans la plupart des cas, parfois un observateur personnalisé est nécessaire. C'est pour cela que Vue fournit une façon plus générique de réagir aux changements de données à travers l'option `watch`. Ceci est très utile lorsque vous souhaitez exécuter des opérations asynchrones ou coûteuses en réponse aux données changeantes.
187187

188188
Par exemple :
189189

0 commit comments

Comments
 (0)