Search code examples
vue.jsnuxt.jsvue-i18nnuxt-i18n

Push a route (Moving from vueJS to nuxtJS)


I am converting a VueJS project to Nuxt.js and I have a problem understanding how nuxt handles routing. Its documentation doesn't say anything about Pushing a route.

Using VueJS I have the following in a component.

 //template
 <input class="" type="search"
        name="q" id="q" v-model="q"
        @keyup.enter="submitSearch"
 >
 //script
  methods: {
        submitSearch() {
            this.$route.push({name: 'search', query: {q: this.q}});

            //also tried the following
            //nuxt.$router.push({name: 'search', query: {q: this.q}});

        }
    }

But this doesn't do a thing in Nuxt. Putting an alert('hi); inside the submitSearch fires fine but I am never redirected to the route.

The goal here is when the user presses enter in the searchbar, to be redirected to /search?q=blablabla

EDIT:

The problem is that the user is redirected to /?q=blablabla instead of /search?..

I just realized that this is because there are different names for multilingual routes.

How am I going to push to a route name that instead of 'search' is named search__en dynamically?


Solution

  • The way I finally did was:

    this.$router.push({path: this.localePath('search'), query: {q: this.q}});