指向 VUEJS 中的另一个链接答案

【问题标题】：Directing to another link in VUEJS指向 VUEJS 中的另一个链接
【发布时间】：2021-07-28 17:55:40
【问题描述】：

我正在使用 VUEJS 制作新标签扩展，我需要找到一种方法将用户重定向到他们为书签输入的链接。出于某种原因，当我尝试这样做时，它不起作用？你能帮忙吗？

HTML

<div id="bookmarks">
  <button v-for="bookmark in bookmarks" v-bind:title="bookmark.name + ('\n') + bookmark.url" id="apps_button" @click="bookmark_link"><img v-bind:src="('https://www.google.com/s2/favicons?domain=') + bookmark.url" />&nbsp;{{ bookmark.name }} 
  </button>
</div>

VueJS

data: {
  bookmarks: [
    { name: "Google", url: "https://www.google.com/?safe=active&ssui=on" },
    { name: "Amazon", url: "https://www.amazon.com" },
    { name: "Apple", url: "https://www.apple.com" },
    { name: "Netflix", url: "https://www.netflix.com" },
    { name: "eBay", url: "https://www.ebay.com" },
  ],
},
methods: {
  bookmark_link: function(bookmarks) {
    window.location.href = bookmarks.url;
  },
},

有什么帮助吗？

【问题讨论】：

为什么不用锚标签而不是按钮？
如果不是按钮，html 和 css 将无法正常工作。感谢您的建议！

标签： javascript html css vue.js

【解决方案1】：

bookmark_link 函数要求提供参数，但您没有发送参数。所以，发送一个，href 应该可以正常工作。

<div id="bookmarks">
  <button v-for="bookmark in bookmarks" v-bind:title="bookmark.name + ('\n') + bookmark.url" id="apps_button" @click="bookmark_link(bookmark)"><img v-bind:src="('https://www.google.com/s2/favicons?domain=') + bookmark.url" />&nbsp;{{ bookmark.name }} 
  </button>
</div>

【讨论】：

非常感谢。这有帮助