推送路由(从 vueJS 迁移到 nuxtJS) [英] Push a route (Moving from vueJS to nuxtJS)

问题描述

我正在将 VueJS 项目转换为 Nuxt.js，但我在理解 nuxt 如何处理路由时遇到问题.它的文档没有提及推送路线.

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.

使用 VueJS 我在一个组件中有以下内容.

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}});

        }
    }

但这在 Nuxt 中没有任何作用.发出警报('hi);submitSearch 内部触发正常，但我从未重定向到路由.

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.

这里的目标是当用户在搜索栏中按 Enter 键时，重定向到/search?q=blablabla

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

问题是用户被重定向到 /?q=blablabla 而不是 /search?..

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.

我将如何推送到动态命名为 search__en 而不是 'search' 的路由名称?

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

推荐答案

我最终采用的方式是:

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

这篇关于推送路由(从 vueJS 迁移到 nuxtJS)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！