From ff227d9b6c3821bb730eeec8bb3aba5d96a3881f Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Wed, 24 May 2017 23:33:28 +0200 Subject: [PATCH 1/3] Traduction de `advanced/scroll-behavior.md` --- docs/en/SUMMARY.md | 2 +- docs/en/advanced/scroll-behavior.md | 30 ++++++++++++++--------------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..fd6ae1e31 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -20,7 +20,7 @@ - [Route Meta Fields (En)](advanced/meta.md) - [Transitions (En)](advanced/transitions.md) - [Data Fetching (En)](advanced/data-fetching.md) - - [Scroll Behavior (En)](advanced/scroll-behavior.md) + - [Comportement du défilement](advanced/scroll-behavior.md) - [Lazy Loading (En)](advanced/lazy-loading.md) - Réference de l'API - [router-link (En)](api/router-link.md) diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index c600df87d..967afed2a 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -1,30 +1,30 @@ -# Scroll Behavior (En)

*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).* +# Comportement du défilement -When using client-side routing, we may want to scroll to top when navigating to a new route, or preserve the scrolling position of history entries just like real page reload does. `vue-router` allows you to achieve these and even better, allows you to completely customize the scroll behavior on route navigation. +En utilisant le routage côté client, nous pourrions vouloir défiler jusqu'au haut de la page lorsqu'on navigue à une nouvelle route, ou alors préserver la position du défilement des entrées de l'historique comme le ferait une page réelle. `vue-router` vous permet de faire cela et en mieux, ainsi que de changer le comportement du défilement pendant la navigation. -**Note: this feature only works in HTML5 history mode.** +**Note : cette fonctionnalité ne fonctionne qu'avec le mode historique HTML5.** -When creating the router instance, you can provide the `scrollBehavior` function: +Pendant la création de l'instance du routeur, vous pouvez renseigner la fonction `scrollBehavior` : ``` js const router = new VueRouter({ routes: [...], scrollBehavior (to, from, savedPosition) { - // return desired position + // retourne la position désirée } }) ``` -The `scrollBehavior` function receives the `to` and `from` route objects. The third argument, `savedPosition`, is only available if this is a `popstate` navigation (triggered by the browser's back/forward buttons). +La fonction `scrollBehavior` reçoit les objets de route `to` et `from`. Le troisième argument, `savedPosition`, est disponible uniquement si c'est une navigation `popstate` (déclenchée par les boutons précédent/suivant du navigateur). -The function can return a scroll position object. The object could be in the form of: +La fonction peut retourner un objet décrivant la position du défilement. L'objet peut être de la forme : -- `{ x: number, y: number }` -- `{ selector: string }` +- `{ x: Number, y: Number }` +- `{ selector: String }` -If a falsy value or an empty object is returned, no scrolling will happen. +Si une valeur équivalente à `false` ou un objet vide est retourné, aucun défilement ne sera produit. -For example: +Par exemple : ``` js scrollBehavior (to, from, savedPosition) { @@ -32,9 +32,9 @@ scrollBehavior (to, from, savedPosition) { } ``` -This will simply make the page scroll to top for all route navigations. +Cela permettra de défiler jusqu'au haut de page à chaque navigation à travers les routes. -Returning the `savedPosition` will result in a native-like behavior when navigating with back/forward buttons: +Retourner l'objet `savedPosition` résultera en un comportement quasi-natif en naviguant avec les boutons précédents/suivants : ``` js scrollBehavior (to, from, savedPosition) { @@ -46,7 +46,7 @@ scrollBehavior (to, from, savedPosition) { } ``` -If you want to simulate the "scroll to anchor" behavior: +Si vous voulez simuler le comportement "défiler à l'ancre" : ``` js scrollBehavior (to, from, savedPosition) { @@ -58,4 +58,4 @@ scrollBehavior (to, from, savedPosition) { } ``` -We can also use [route meta fields](meta.md) to implement fine-grained scroll behavior control. Check out a full example [here](https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js). +On peut aussi utiliser les [champs meta de route](meta.md) pour implémenter un contrôle bien précis pour le comportement du défilement. Allez voir un exemple complet [ici](https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js). From 271fbe7e4df187005043c4d0e02fdec88d444eff Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Sat, 27 May 2017 16:23:00 +0200 Subject: [PATCH 2/3] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=201?= =?UTF-8?q?=C3=A8re=20review=20de=20Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/advanced/scroll-behavior.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index 967afed2a..f798e1471 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -1,6 +1,6 @@ # Comportement du défilement -En utilisant le routage côté client, nous pourrions vouloir défiler jusqu'au haut de la page lorsqu'on navigue à une nouvelle route, ou alors préserver la position du défilement des entrées de l'historique comme le ferait une page réelle. `vue-router` vous permet de faire cela et en mieux, ainsi que de changer le comportement du défilement pendant la navigation. +En utilisant le routage côté client, nous pourrions vouloir faire défiler la page jusqu'en haut lorsqu'on navigue vers une nouvelle route, ou alors préserver la position du défilement des entrées de l'historique comme le ferait une page réelle. `vue-router` vous permet de faire cela et, encore mieux, vous permet de changer le comportement du défilement pendant la navigation. **Note : cette fonctionnalité ne fonctionne qu'avec le mode historique HTML5.** @@ -10,7 +10,7 @@ Pendant la création de l'instance du routeur, vous pouvez renseigner la fonctio const router = new VueRouter({ routes: [...], scrollBehavior (to, from, savedPosition) { - // retourne la position désirée + // retourner la position désirée } }) ``` @@ -32,9 +32,9 @@ scrollBehavior (to, from, savedPosition) { } ``` -Cela permettra de défiler jusqu'au haut de page à chaque navigation à travers les routes. +Cela permettra de défiler au haut de la page à chaque navigation à travers les routes. -Retourner l'objet `savedPosition` résultera en un comportement quasi-natif en naviguant avec les boutons précédents/suivants : +Retourner l'objet `savedPosition` résultera en un comportement quasi-natif en naviguant avec les boutons précédents/suivants : ``` js scrollBehavior (to, from, savedPosition) { @@ -46,7 +46,7 @@ scrollBehavior (to, from, savedPosition) { } ``` -Si vous voulez simuler le comportement "défiler à l'ancre" : +Si vous voulez simuler le comportement « aller à l'ancre » : ``` js scrollBehavior (to, from, savedPosition) { From 7467b596904276c2ecc9545c81f0066873491a9a Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Sat, 27 May 2017 16:40:54 +0200 Subject: [PATCH 3/3] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=202?= =?UTF-8?q?=C3=A8me=20review=20de=20Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/advanced/scroll-behavior.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index f798e1471..2d176188c 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -19,7 +19,7 @@ La fonction `scrollBehavior` reçoit les objets de route `to` et `from`. Le troi La fonction peut retourner un objet décrivant la position du défilement. L'objet peut être de la forme : -- `{ x: Number, y: Number }` +- `{ x: number, y: number }` - `{ selector: String }` Si une valeur équivalente à `false` ou un objet vide est retourné, aucun défilement ne sera produit. @@ -32,7 +32,7 @@ scrollBehavior (to, from, savedPosition) { } ``` -Cela permettra de défiler au haut de la page à chaque navigation à travers les routes. +Cela permettra de défiler au haut de page à chaque navigation à travers les routes. Retourner l'objet `savedPosition` résultera en un comportement quasi-natif en naviguant avec les boutons précédents/suivants :