Skip to content

Commit 7f42679

Browse files
authored
Merge pull request #13 from Kocal/advanced/transitions.md
Traduction de `advanced/transitions.md`
2 parents 33922e7 + 875bcdc commit 7f42679

File tree

2 files changed

+12
-12
lines changed

2 files changed

+12
-12
lines changed

docs/en/SUMMARY.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
- Avancé
1919
- [Navigation Guards (En)](advanced/navigation-guards.md)
2020
- [Route Meta Fields (En)](advanced/meta.md)
21-
- [Transitions (En)](advanced/transitions.md)
21+
- [Les transitions](advanced/transitions.md)
2222
- [Data Fetching (En)](advanced/data-fetching.md)
2323
- [Scroll Behavior (En)](advanced/scroll-behavior.md)
2424
- [Lazy Loading (En)](advanced/lazy-loading.md)

docs/en/advanced/transitions.md

+11-11
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
# Transitions (En) <br><br> *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/vue-router).*
1+
# Les transitions
22

3-
Since the `<router-view>` is essentially a dynamic component, we can apply transition effects to it the same way using the `<transition>` component:
3+
Vu que `<router-view>` est essentiellement un composant dynamique, on peut lui appliquer certains effets de transitions en utilisant le composant `<transition>` :
44

55
``` html
66
<transition>
77
<router-view></router-view>
88
</transition>
99
```
1010

11-
[Everything about `<transition>`](http://vuejs.org/guide/transitions.html) works the same here.
11+
[Tout à propos de `<transition>`](http://fr.vuejs.org/v2/guide/transitions.html) fonctionne également ici de la même manière.
1212

13-
### Per-Route Transition
13+
### Transition par route
1414

15-
The above usage will apply the same transition for all routes. If you want each route's component to have different transitions, you can instead use `<transition>` with different names inside each route component:
15+
L'utilisation au dessus applique la même transition pour chaque route. Si vous voulez que les composants de route aient des transitions différentes, vous pouvez utiliser à la place `<transition>` avec des noms différents à l'intérieur de chaque composant de route :
1616

1717
``` js
1818
const Foo = {
@@ -32,20 +32,20 @@ const Bar = {
3232
}
3333
```
3434

35-
### Route-Based Dynamic Transition
35+
# Transition dynamique basée sur la route
3636

37-
It is also possible to determine the transition to use dynamically based on the relationship between the target route and current route:
37+
Il est aussi possible de déterminer la transition à utiliser en se basant sur la relation entre la route cible et la route actuelle :
3838

3939
``` html
40-
<!-- use a dynamic transition name -->
40+
<!-- utiliser un nom de transition dynamique -->
4141
<transition :name="transitionName">
4242
<router-view></router-view>
4343
</transition>
4444
```
4545

4646
``` js
47-
// then, in the parent component,
48-
// watch the $route to determine the transition to use
47+
// et dans le composant parent,
48+
// observer la `$route` pour déterminer la transition à utiliser
4949
watch: {
5050
'$route' (to, from) {
5151
const toDepth = to.path.split('/').length
@@ -55,4 +55,4 @@ watch: {
5555
}
5656
```
5757

58-
See full example [here](https://github.com/vuejs/vue-router/blob/dev/examples/transitions/app.js).
58+
Voir un exemple complet [ici](https://github.com/vuejs/vue-router/blob/dev/examples/transitions/app.js).

0 commit comments

Comments
 (0)