¿Cómo puedo mantener los parámetros mientras navego por las rutas? El parámetro o los parámetros deben estar en todas las páginas de la aplicación (no solo en las rutas anidadas). En angular puedo hacer esto con this._router.navigate([''], { queryParamsHandling: 'merge' }) , pero ¿cómo puedo hacerlo con vue.js?
Ejemplo de rutas base:
// base route 1 -> http://example.test/?user_code=1234&member=false // base route 2 -> http://example.test/?user_code=56789&member=false // base route 3 -> http://example.test/?user_code=4321 ¿Cómo puedo mantener los parámetros user_code y member en cada ruta que navego?
ejemplo de lo que quiero
// navigated route 1 -> http://example.test/about?user_code=1234&member=false // navigated route 2 -> http://example.test/whatever_page?user_code=56789&member=false // ... ¿Por qué necesito esto? Porque entonces necesitaré los parámetros para hacer cosas en la aplicación Ex: this.$route.query.user_code == '1234' ? 'do this' : 'do that';
¡Gracias de antemano!
Un enfoque típico sería usar el estado y enviar la ruta completa de la ruta a ese atributo de estado (probablemente una matriz).
Con vuex:
// store/index.js import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const store = new Vuex.Store({ state: { paths: [] }, mutations: { PUSH_PATH (fullPath) { paths.push(fullPath) } }, actions: { pushPath(commit, fullPath) { commit("PUSH_PATH", fullPath) } } }) // in a component import { mapActions } from "vuex"; ... methods: { ...mapActions("pushPath") }, created() { this.pushPath(this.$route.fullPath) }Ahora, si usó pushPath, cuando se crea su vista, agregaría fullPath a una matriz sobre la que luego podría tomar decisiones mediante inyección, inspección, etc.
Otra opción popular, especialmente cuando se toman decisiones basadas en rutas, es usar "Guardias de navegación". Estas son funciones que interceptan la ruta y te permiten realizar alguna acción. Hay más detalles disponibles aquí: https://router.vuejs.org/guide/advanced/navigation-guards.html