Skip to content

Commit 3ed1fab

Browse files
Ti BretinTi Bretin
authored andcommitted
seconde correction events.md
1 parent d12f4d3 commit 3ed1fab

File tree

1 file changed

+23
-22
lines changed

1 file changed

+23
-22
lines changed

src/v2/guide/events.md

Lines changed: 23 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ var example1 = new Vue({
4242
</script>
4343
{% endraw %}
4444

45-
## Les méthodes de gestion d'évènement"
45+
## Les méthodes de gestion d'évènement
4646

4747
La logique pour beaucoup des gestionnaires d'événements sera très certainement plus complexe, par conséquence, garder votre JavaScript dans la valeur de l'attribut v-on ne sera tout simplement pas possible. C'est pourquoi v-on peut aussi accepter le nom d'une méthode que vous voudriez appeler.
4848

@@ -75,7 +75,7 @@ var example2 = new Vue({
7575
})
7676

7777
// vous pouvez également invoquer ces méthodes en JavaScript
78-
2.greet() // -> 'Hello Vue.js!'
78+
example2.greet() // -> 'Hello Vue.js!'
7979
```
8080

8181
Résultat :
@@ -126,8 +126,8 @@ new Vue({
126126
Résultat:
127127
{% raw %}
128128
<div id="example-3" class="demo">
129-
<button v-on:click="say('hi')">Say hi</button>
130-
<button v-on:click="say('what')">Say what</button>
129+
<button v-on:click="say('salut')">Dire salut</button>
130+
<button v-on:click="say('quoi')">Dire quoi</button>
131131
</div>
132132
<script>
133133
new Vue({
@@ -150,7 +150,7 @@ Parfois nous avons également besoin d'accéder à l'événement original du DOM
150150
``` js
151151
// ...
152152
methods: {
153-
avertissement: function (message, event) {
153+
warn: function (message, event) {
154154
// now we have access to the native event
155155
if (event) event.preventDefault()
156156
alert(message)
@@ -160,9 +160,9 @@ methods: {
160160

161161
## Modificateurs d'événements
162162

163-
C'est un besoin courant que de faire appel ā `event.preventDefault()` ou `event.stopPropagation()` à l'intérieur d'une déclaration de gestionnaire d'évènement. Bien que nous puissions réaliser ceci aisément à l'intérieur de " Methods " , il serait préférable que les méthodes restent purement dediées à la logique des données au lieu d'avoir à prendre en charge les événements du DOM en détails.
164-
``
165-
Pour résoudre ce problème, Vue propose des modificateurs d'événement pour `v-on`. Faire appel à ces modificateurs se fait grâce aux extensions d'instruction, ceux-ci commençant par un point.
163+
C'est un besoin courant que de faire appel ā `event.preventDefault()` ou `event.stopPropagation()` à l'intérieur d'une déclaration de gestionnaire d'évènement. Bien que nous puissions réaliser ceci aisément à l'intérieur de " methods " , il serait préférable que les méthodes restent purement dediées à la logique des données au lieu d'avoir à gérer les détails des évènements du DOM.
164+
165+
Pour résoudre ce problème, Vue propose des modificateurs d'événement pour `v-on`. Rappelez-vous que les modificateurs sont des suffixes de directives indiqués par un point.
166166

167167
- `.stop`
168168
- `.prevent`
@@ -174,7 +174,7 @@ Pour résoudre ce problème, Vue propose des modificateurs d'événement pour `v
174174
<!-- la propagation de l'événement du clic sera stoppée -->
175175
<a v-on:click.stop="doThis"></a>
176176

177-
<!-- l'événement « submit », ne rechargera plus la page -->
177+
<!-- l'événement « submit » ne rechargera plus la page -->
178178
<form v-on:submit.prevent="onSubmit"></form>
179179

180180
<!-- les modificateurs peuvent être chainés -->
@@ -183,10 +183,10 @@ Pour résoudre ce problème, Vue propose des modificateurs d'événement pour `v
183183
<!-- seulement le modificateur -->
184184
<form v-on:submit.prevent></form>
185185

186-
<!-- utilise le mode « capture » lorsque l'événement d'écoute est ajouté -->
186+
<!-- utilise le mode « capture » lorsque l'événement écouteur est ajouté -->
187187
<div v-on:click.capture="doThis">...</div>
188188

189-
<!-- seulement déclanché si l'instruction « event.target » est l'élément lui même.-->
189+
<!-- seulement déclenché si l'instruction « event.target » est l'élément lui même.-->
190190
<!-- c-à-d : ne s'applique pas aux éléments "enfant" -->
191191
<div v-on:click.self="doThat">...</div>
192192
```
@@ -195,12 +195,13 @@ Pour résoudre ce problème, Vue propose des modificateurs d'événement pour `v
195195
196196
``` html
197197
<!-- l'événement « click » sera déclenché au moins une fois -->
198-
<a v-on:click.once="faisCeci"></a>
198+
<a v-on:click.once="DoThis"></a>
199199
```
200200

201201
Au contraire des autres modificateurs, qui sont exclusifs aux événements natifs du DOM, le modificateur `.once` peut également être utilisé pour les [événements des composants](components.html#Using-v-on-with-Custom-Events). Si vous n'avez pas encore lu la section concernant les composants, ne vous en inquiétez pas pour le moment.
202202

203203
## Modificateurs "key" (Touches)
204+
204205
Lorsque nous écoutons les événements du clavier, nous avons régulièrement besoin de s'assurer des codes des touches. Vue permet également d'ajouter un modificateur de touches pour `v-on`:
205206

206207
``` html
@@ -222,15 +223,15 @@ Voici la liste complète des raccourcis de modificateur pour les touches :
222223

223224
- `.enter`
224225
- `.tab`
225-
- `.delete` (fonctionne pour les touches "Suppression" et "retour-arrière")
226+
- `.delete` (fonctionne pour les touches "Suppression" et "Retour arrière")
226227
- `.esc`
227228
- `.space`
228229
- `.up`
229230
- `.down`
230231
- `.left`
231232
- `.right`
232233

233-
Vous pouvez également [definir des raccourcis personnalisés pour vos modificateurs ](../api/#keyCodes) grâce à l'objet global `config.keyCodes`:
234+
Vous pouvez également [définir des raccourcis personnalisés pour vos modificateurs ](../api/#keyCodes) grâce à l'objet global `config.keyCodes`:
234235

235236
``` js
236237
// active v-on:keyup.f1
@@ -241,14 +242,14 @@ Vue.config.keyCodes.f1 = 112
241242

242243
> New in 2.1.0
243244
244-
Vous pouvez utiliser les modificateurs suivants pour déclancher un événement du clavier ou de la souris seulement lorsque la touche du modificateur correspondant est appuyé :
245+
Vous pouvez utiliser les modificateurs suivants pour déclencher un événement du clavier ou de la souris seulement lorsque la touche du modificateur correspondante est appuyé :
245246

246247
- `.ctrl`
247248
- `.alt`
248249
- `.shift`
249250
- `.meta`
250251

251-
> Note: Sur les claviers Macintosh, meta est la touche commande (⌘). Sur Windows, meta est la touche windows (⊞). Sur les claviers Sun Microsystems, meta est symbolisé par un diamant plein (◆). Sur certain clavier, spécifiquement sur les claviers des machines MIT et Lisp et leurs successeurs, comme le clavier « Knight » et « space-cadet », meta est ecrit « META ». Sur les claviers Symboliques, meta est etiqueté « META » ou « Meta ».
252+
> Note: Sur les claviers Macintosh, meta est la touche commande (⌘). Sur Windows, meta est la touche windows (⊞). Sur les claviers Sun Microsystems, meta est symbolisé par un diamant plein (◆). Sur certains claviers, spécifiquement sur les claviers des machines MIT et Lisp et leurs successeurs, comme le clavier « Knight » et « space-cadet », meta est ecrit « META ». Sur les claviers Symboliques, meta est etiqueté « META » ou « Meta ».
252253
253254
Par exemple:
254255

@@ -260,13 +261,13 @@ Par exemple:
260261
<div @click.ctrl="doSomething">Do something</div>
261262
```
262263

263-
## Pourquoi des écoutes dans le code HTML ?
264+
## Pourquoi des écouteurs dans le HTML ?
264265

265-
Vous pouriez être preoccupé que tous ces événements d'écoutes viole la bonne vieille règle de la séparation des préoccupations.
266-
Rassurez-vous - depuis que le gestionnaire de fonctions et d'expressions est strictement lié à « ViewModel » qui gère la vue courante, cela ne causera aucune difficulté de maintenance. En realité, il y a plusieurs bénéfices à utiliser `v-on` :
266+
Vous pourriez être inquiets du fait que l'ensemble de cette approche d'écouteurs d'évènements viole la bonne vieille règle de la séparation des préoccupations.
267+
Rassurez-vous - puisque toutes les fonctions et expressions sont strictement liées à « ViewModel » qui gère la vue courante, cela ne causera aucune difficulté de maintenance. En realité, il y a plusieurs bénéfices à utiliser `v-on` :
267268

268-
1. Il est plus facile de localiser l'implementation des fonctions dans le gestionnaire de code JS en survolant le code HTML.
269+
1. Il est plus facile de localiser l'implémentation des fonctions de gestion du code JS en survolant le code HTML.
269270

270-
2. Comme vous n'avez pas à attacher manuellement les écoutes dans votre JS, le code du « ViewModel » peut-être purement logique et sans DOM. Ceci rend plus facile les tests.
271+
2. Comme vous n'avez pas à attacher manuellement les écouteurs dans votre JS, le code du « ViewModel » peut-être purement logique et sans DOM. Ceci rend plus facile les tests.
271272

272-
3. Quand un « ViewModel » est detruit, tout les evenements d'ecoutes sont automatiquenemt retiré. Vous n'avez pas à vous soucier de le faire vous-même.
273+
3. Quand un « ViewModel » est détruit, tout les événements écouteurs sont automatiquenemt retiré. Vous n'avez pas à vous soucier de le faire vous-même.

0 commit comments

Comments
 (0)