javascript - 标签将 href 附加到当前 url 而不是直接链接到 href 内部的内容

Question

在 Vue 组件中，有一些内容是从 firebase 中提取并导入到表格中以便显示的。这些“字段”之一可以说是 url。在数据库中，它的结构为 {name:"my link",url:"www.example.com"} 并直接放入标签 href 中。当该组件加载并且我检查标签时，它说 hrefs 值为“www.example.com”但是当我单击链接时它转到“currentURL/www.example.com”下面我已经包含了有问题的标签。它是标签的一部分，对于特定内容类型中的每个字段，都有逻辑决定该字段是什么类型

<a v-else-if="findFieldType(field.name) === 'url'" :href="filteredContent[index][field.name].link">{{ filteredContent[index][field.name].name }}</a>

标签应该链接到它的 href 属性中的内容(“www.example.com”)，而不是将 href 的值附加到当前 url 并链接到那个(“myCurrentUrl/www.example.com” ").

当使用 vue-router 时，这种行为是预期的，因为它的作用是将提供的值附加到当前 url，所以我尝试在那里搜索修复但无济于事。这就是我使用标签的原因，以确保 vue-router 不会弄乱我的链接，并且单击该链接将直接指向 href 中的内容。

Answer 1

查看syntax of a URL :

The following are two example URIs and their component parts:

     foo://example.com:8042/over/there?name=ferret#nose
     \_/   \______________/\_________/ \_________/ \__/
      |           |            |            |        |
   scheme     authority       path        query   fragment
      |   _____________________|__
     / \ /                        \
     urn:example:animal:ferret:nose

www.example.com 既不是以方案或 // 开头的，这将使它相对于当前方案。

因此，它是一个相对于当前路径的 URL。

添加方案(或//)例如http://www.example.com。