Vue.js 如何将数据设置到 nuxt.js nuxtlink

发布于09月25日

我试图将数据传递到nuxt link，但当我点击链接时，nuxt link刚刚返回404错误.它似乎没有获取和加载文件....

第二个链接使用:href和硬编码

<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>

Nuxt和Vue的新成员.js.谢谢

推荐答案

Nuxt通过阅读vue路由文档来使用vue路由，您将能够实现自己的目标.

router-link documentation

下面的例子

<!-- 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>

这将在$route对象中的下一个页面上显示为$route.params，或者在上面的url查询中显示.