15

我正在将 VueJS 项目转换为 Nuxt.js,但我无法理解 nuxt 如何处理路由。它的文档没有说明推送路线。

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

 //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 内触发很好,但我从未被重定向到该路线。

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

编辑:

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

我刚刚意识到这是因为多语言路线有不同的名称。

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

4

3 回答 3

31

我最终做到的方式是:

this.$router.push({path: this.localePath('search'), query: {q: this.q}});
于 2018-05-16T20:09:18.407 回答
1

不是一个直接的答案,但在使用散列时我发现这很好用。如果将来有任何问题,将回来编辑。

this.$router.push( #${hash});

于 2020-08-16T20:01:09.667 回答
0

Nuxt v2.14.12 面临同样的问题。经过一番挖掘,发现了一个 Nuxt Helperrouter的对象。目前工作正常。this.$nuxt.$options.routerthis.$nuxt.$options.router.push()

于 2021-03-11T20:43:42.290 回答