File: named-routes.md

package info (click to toggle)
vue-router.js 3.4.9%2Bds-2
  • links: PTS, VCS
  • area: main
  • in suites: bullseye
  • size: 3,212 kB
  • sloc: javascript: 7,982; sh: 22; makefile: 5
file content (31 lines) | stat: -rw-r--r-- 926 bytes parent folder | download | duplicates (3)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
# Rutas con nombre

 A veces es conveniente identificar una ruta con un nombre, especialmente cuando enlazamos a esa ruta o navegamos mediante código. Puedes darle un nombre a una ruta en las opciones de `routes` cuando se crea la instancia de Router:

``` js
const router = new VueRouter({
  routes: [
    {
      path: '/user/:userId',
      name: 'user',
      component: User
    }
  ]
})
```

Para enlazar a una ruta con nombre, puedes pasar un objeto a la propiedad `to` del componente `router-link`:

``` html
<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>
```

Este es exactamente el mismo objeto utilizado mediante código con `router.push()`:

``` js
router.push({ name: 'user', params: { userId: 123 }})
```

En ambos casos, el _router_ navegará a la ruta `/user/123`.

Revisa un ejemplo completo [aquí](https://github.com/vuejs/vue-router/blob/dev/examples/named-routes/app.js).