Vue.js 根据道具数据改变的超链接

Vue.js hyperlinks that change based on prop data

我的 Vue 项目的主页有多个 Bootstrap 卡片，每个卡片都需要一个 hyperlink 按钮，与其他按钮共享相同的基础 URL。 URL 的末尾需要是卡片从中获取信息的道具的 "name" 属性 值。例如：

第一张牌 - URL = "https://coinmarketcap.com/currencies" + "/bitcoin"

"bitcoin" 应该来自 propName.name.

第二张牌 - URL = "https://coinmarketcap.com/currencies" + "/litecoin"

"litecoin" 应该来自 propName.name.

等等....

我试过以下方法：

  1. 使用 data() 到 return "baseURL" 其具有基础 URL 的值，使 "baseURL" 成为 href 值，然后追加{{propName.name}}到最后。

  2. 使用使用 "onclick="window.location.href=... + {{propName.name}}" 的输入标签制作 link 按钮" =13=]

无论我尝试将“+ {{propName.name}}”修改为 URL，要么应用程序无法编译，要么我收到一条错误消息，指出我无法使用"+".

我能做什么？

谢谢。

您需要将变量绑定到 href 属性： :href="baseURL + propName.name"

我假设 baseURL 是 data() 的 属性。