Question

我距离我需要去的地方很近，但距离不够。这是我的代码

                 <td>
            <a href="https://www.ncbi.nlm.nih.gov/pubmed/"
              {{item.pmid}} target="_blank">{{ item.pmid }}</a>
          </td>
          <td>{{ item.year }}</td>
          <td>{{ item.title }}</td>
          <td>{{ item.authors }}</td>
          <td>{{ item.article }}</td>
          <td>{{ item.journal }}</td>
          <td>{{ item.rcr }}</td>
          <td class="text-xs-right">{{ item.percentile }}</td>

如果我取出href {{item.pmid}}，它将在新窗口中转到网页。但是，我需要将item.pmid值添加到href字符串的末尾，以便它将转到确切的页面。如果按现在的方式进行操作，则会收到错误消息，提示“元素”：“ {{”不是有效的属性名称。有什么办法可以将值连接到字符串吗？

好的-我发现了这一点： How to put variable in a href on the vue js 2? 但是仍然不确定如何使用v-bind

Answer 1

明白了-

           <td>
            <a
              :href="'https://www.ncbi.nlm.nih.gov/pubmed/' + item.pmid"
              target="_blank"
            >{{ item.pmid }}</a>
          </td>

Answer 2

如果有人仍然想知道的话，最好的方法是使用dynamic rows

他们是这样工作的：

<v-data-table
    :headers="tableHeaders"
    :items="tableItems"
>
  <template v-slot:item.link="{ item }">
    <a :href="item.link">Link</a>
  </template>
</v-data-table>

在Vuetify数据表中建立超链接-也许是v-bind？

2 个答案: