<a> 标签将 href 附加到当前 url，而不是直接链接到 href 内部的内容答案

【问题标题】：<a> tag appending href to current url instead of linking directly to what is inside of the href<a> 标签将 href 附加到当前 url，而不是直接链接到 href 内部的内容
【发布时间】：2019-07-03 14:10:45
【问题描述】：

在 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 中的内容。

【问题讨论】：

我们可以将这个问题精简为“<a href="www.example.com">Link!</a> 不起作用”，这可能是一个骗局。
尽管这是一个非常愚蠢的问题（别担心，它发生在我们中最优秀的人身上），它的措辞和格式都很好。第一个问题好！
感谢@SIGSTACKFAULT，我知道这很愚蠢，我可以简化很多，但是信息越多越好，你永远不知道什么小细节可以使某人理解问题所在.

标签： javascript html vuejs2

【解决方案1】：

看syntax of a URL：

以下是两个示例 URI 及其组成部分：

     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.

【讨论】：