Как правильно организовать динамический поиск VueJS?

Question

[Rooly]

в App.vue

у меня есть watch, который отслеживает this.$route.query

watch: {
    '$route.query': {
      handler: function(query_string) {
        // здесь код
      },
      deep: true,
      immediate: true
    }
  }

и есть метод router_push, который добавляет (или заменяет значение) GET-параметры к пути.

router_push(query_string) {
        let query_object = Object.fromEntries(query_string.split("&").map((pair) => pair.split("=")))
        for (let key in router.currentRoute.query) {
          for (let key_inner in query_object) {
            if (key_inner !== key) {
              query_object[key] = router.currentRoute.query[key]
            }
          }
        }
        const result_query_string = Object.entries(query_object)
          .map((pair) => pair.join("="))
          .join("&");
        router.push(`${router.currentRoute.path}?${result_query_string}`).catch(err => console.log(err))
 
      },

Исходя из логики, все должно работать, однако происходит ошибка
Avoided redundant navigation to current location: "/?search_type=device_title&search=1"

Как-то нужно всё через params оформить, но у меня тут я не знаю сколько GET-параметров будет

Answer 1

[Антон Антон]

выкинуть всё.
https://router.vuejs.org/ru/guide/essentials/navig... - в location передать объект {name: '...', {query: {...}}}
https://router.vuejs.org/ru/api/#%D1%81%D0%B2%D0%B...
навесить watch на '$route.query'

Comments

[Rooly]

Помог! Отметил решением!