Guía

Enrutamiento

Router Oficial

Para la mayorias de las SPAs, es recomendado utilizar la librería con soporte oficial vue-router. Por más detalles, ver la documentación de vue-router.

Routeo simple desde cero

Si usted solo necesitar un enrutamiento muy simple y no deseas utilizar una librería de enrutamiento con todas las funcionalidades, usted puede hacerlo de renderizando dinamicamente un componente de nivel página como este:

const NotFound = { template: '<p>Page not found</p>' }
const Home = { template: '<p>home page</p>' }
const About = { template: '<p>about page</p>' }

const routes = {
  '/': Home,
  '/about': About
}

new Vue({
  el: '#app',
  data: {
    currentRoute: window.location.pathname
  },
  computed: {
    ViewComponent () {
      return routes[this.currentRoute] || NotFound
    }
  },
  render (h) { return h(this.ViewComponent) }
})

Combinado con la API HTML5 History, usted puede construir un muy básico pero totalmente funcional enrutador del lado del cliente. Para ver esto en practica, visita esta app de ejemplo.

Integrando Enrutadores de terceros

Si hay algun enrutador de terceros que usted prefier utilizar, como Page.js o Director, la integracion es igualmente fácil. Aquí hay un ejemplo completo utilizando Page.js.

← Soporte TypeScript Administración del Estado →
¿Encontró un error o simplemente quiere contribuir con la documentación? Edite esta página en GitHub! Puesto en marcha en Netlify