javascript 如何将数据设置到nuxt.js next-link?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/46396291/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-29 06:38:40  来源:igfitidea点击:

How to set data into nuxt.js next-link?

javascriptvue.jsvue-componentnuxt.js

提问by user805981

I'm trying to pass data into nuxt-link but nuxt-link is just returning a 404 error when I click on the link. It doesn't seem to be getting and loading the file....

我正在尝试将数据传递到 nuxt-link,但是当我单击链接时,nuxt-link 只是返回 404 错误。它似乎没有获取和加载文件....

The second 2 links that use :href and hardcoding works

使用 :href 和硬编码的第二个 2 链接有效

<h2 class="subtitle"><nuxt-link :to="{path: filePath}" exact>Nuxt View Menu</nuxt-link></h2>
<h2 class="subtitle"><a :href="filePath">Vue View Menu</a></h2>
<h2 class="subtitle"><a href="files/officialMenu.pdf">HardCode View Menu</a></h2>

<script>
export default {
  layout: 'default',
  data () {
    return {
      filePath: 'files/officialMenu.pdf'
    }
  }
}
</script>

New to Nuxt and Vue.js. Thanks!

Nuxt 和 Vue.js 的新手。谢谢!

回答by sevensilvers

Nuxt uses vue-router by reading off the vue-router documentation you'll be able to achieve what you want.

Nuxt 通过阅读 vue-router 文档来使用 vue-router,您将能够实现您想要的。

router-link documentation

路由器链接文档

Example below

下面的例子

<!-- named route -->
<nuxt-link :to="{ name: 'user', params: { userId: 123 }}">User</nuxt-link>

<!-- with query, resulting in `/register?plan=private` -->
<nuxt-link :to="{ path: 'register', query: { plan: 'private' }}">Register</nuxt-link>

This will be available to your next page in $routeobject as $route.paramsor in the url query as seen above.

这将在$route对象中作为$route.params或在上面看到的 url 查询中提供给您的下一个页面。