Javascript 制作链接<；a>；在VUE js中使用data/curlybrackets{{}

我正在寻找一种方法来创建指向不同页面的链接，这些页面的数据放在方括号中{{}， 我就是不知道怎么用它们

  <div id="app">
      <div v-for="data in categorie">
        <button v-on:click=" filterFunction(data) ">{{data}}</button>
        <a href="testsite{{data}}.html"> test links </a>
      </div>
    </div>

{{data}}

---

有人能帮帮我吗？

这里真的不需要花括号。相反，您应该使用

v-bind

：

 <div id="app">
      <div v-for="data in categorie">
        <button v-on:click=" filterFunction(data) ">{{data}}</button>
        <a v-bind:href="'testsite'+data+'.html'"> test links </a>
      </div>
    </div>

{{data}}

使用

v-bind

可以用单引号标记url的静态文本，

数据

可以放在任何需要的地方

---

一些

使用Vue您可以使用

href

{{data}}

请务必注意可能的安全问题，您需要自己对

数据
变量进行消毒