Question

我的nuxt应用程序中有一个帖子页面。在侧面，我有一个newArticles组件，其中显示了新文章的列表。我希望能够单击其中一篇新文章并导航到它。

您在文章上的网址是article / {articleId}。但是，当我使用nuxt-link：to =“ postLink”时，其中postLink是'article /'+ articleId形式的计算属性，我被路由到article / articles / {articleId}而不是article / {articleId}

我一直在阅读vue路由器文档，但找不到解决方案。我尝试使用精确并将名称作为参数传递，但似乎无济于事。

授权代码：

<template>
  <div class="box">
    <article class="media">
      <nuxt-link 
        :to="postLink" 
        exact>
        <div class="media-left helper">
          <figure class="image is-96x96">
            <img
              :src="imageLink"
              class ="side-image"
              alt="Image">
          </figure>
        </div>
      </nuxt-link>
    </article>
  </div>
</template>

<script>

export default {
  name: 'SideArticle',
  props: {
    id: {
      type: String,
      required: true
    },
    more props....
  },
  computed: {
    imageLink() {
      return process.env.IMAGES_BASE_URL + JSON.parse(this.imagesurls)[0]
    },
    postLink() {
      return 'article/' + this.id
    }
  },
}
</script>

Answer 1

您是否尝试过在路径前面加上斜杠？

像这样：

postLink() {
    return '/article/' + this.id
}

如何防止nuxt-link修改我设置的路径？

1 个答案: