javascript - vue title attribute

¿Cómo puedo volver/enrutar en vue-router?

Question

Ok, para explicar esto simplemente:

Tengo 3x páginas.

• Página 1 (Inicio)
• Página 2 (Menú)
• Página 3 (Acerca de)

La página 1 tiene un

<router-link  to="/menu">

botón que al hacer clic se encamina a "/ menu".

Por ahora, la página 2 (Menú) tiene un

<router-link  to="/">

y cuando se hace clic en este botón, vuelve a la ubicación anterior "/" Página 1 (Inicio).

Pero no quiero crear un componente para el enrutador para que cada página ''regrese'' a la página anterior (como si tuviera 100 páginas, esto podría ser una gran cantidad de trabajo de enrutamiento). ¿Hay alguna manera de hacer esto con vue-router? similar a window.history.back ()

Tengo curiosidad por ver si hay una manera de hacer esto, ya que no puedo encontrarlo en los documentos.

¡Gracias por adelantado! Juan

Answer 1

Puedes usar la navegación programática . Para volver, usas esto:

router.go(n) 

Donde n puede ser positivo o negativo (volver). Esto es lo mismo que history.back (). Así que puedes tener tu elemento así:

<a @click="$router.go(-1)">back</a>

Answer 2

Si está utilizando Vuex , puede usar https://github.com/vuejs/vuex-router-sync

Solo inicialízalo en tu archivo principal con:

import VuexRouterSync from ''vuex-router-sync'';
VuexRouterSync.sync(store, router);

Cada cambio de ruta actualizará el objeto de estado de route en Vuex . A continuación, puede crear el getter para usar el Objeto en el estado de ruta o simplemente usar el state (mejor es usar captadores, pero es otra historia https://vuex.vuejs.org/en/getters.html ), así que en resumen sería (dentro de los métodos / valores de los componentes):

this.$store.state.route.from.fullPath

También puedes colocarlo en el componente <router-link> :

<router-link :to="{ path: $store.state.route.from.fullPath }"> 
  Back 
</router-link>

Por lo tanto, cuando utilice el código anterior, el enlace a la ruta anterior se generará de forma dinámica.