时间戳

首页 > 解决方案 > Vue：@click 上 :to 属性的奇怪行为

javascript - Vue：@click 上 :to 属性的奇怪行为

问题描述

我有这个对象：

标签.vue：

<template>
  <router-link :to="getTo"
               custom v-slot="{ navigate }">
  <div role="link" @click="navigate">
    {{text}}</div>
  </router-link>
</template>

<script>
export default {
  props: {
    text: {
      type: String
    },
    date:  {
      type: String
    },
    link: {
      type: String,

    }
  },
  created()  {
    console.log("this link: " + this.link);
  },
  computed:  {
    getTo: function()  {
      console.log("text: " + this.text);
      console.log("link: " + "hashtag/" + this.text);
      return "hashtag/" + this.text;
    }
  }
}
</script>

并在HashtagsList.vue中使用它：

<template>
  <div>

    <Hashtag text="test1"/>
    <Hashtag text="test2"/>
    <Hashtag text="test3"/>
    <Hashtag text="test4"/>
    <Hashtag text="test5"/>

  </div>
</template>

但是，当我在位于

http://localhost:8080/hashtag/sometag

它去

http://localhost:8080/hashtag/hashtag/sometag

代替

http://localhost:8080/hashtag/sometag

我如何解决它？

http://localhost:8080/hashtag/test2

标签： javascriptvue.jsvuejs2

解决方案

您可以尝试在您的路线前使用“/”以使其成为绝对路线，并且 vue 不会连接该路线。

"/hastag/" + this.text

推荐阅读