Laravel nova 自定义卡片 vue 文件 - 如何将 href 属性设置为外部 url

Question

所以我在 Laravel nova 中制作了一张自定义卡片，我想传入一个 URL 作为元数据并将 link 的 href 属性设置为 [=33] =].

它有效，但 Vue 一直将 URL 设置为内部 URL:

我希望它是：

http://foo.peoplebase.test/admin

但是当我点击 link 时，我得到的结果是：

http://peoplebase.test/admin/dashboards/http//:foo.peoplebase.test

这是 Vue 文件

<template>
<card class="flex flex-col items-center justify-center">
    <div class="px-3 py-3">
        <h1 class="text-center text-3xl text-80 font-light">{{ card.title }}</h1>
    </div>
    <div class="px-3 py-3">
        <a :href="'http//:' + card.domain + '.peoplebase.test'" class="btn btn-default btn-primary inline-flex items-center relative" target="_blank">Website</a>
        <a :href="'http//:' + card.domain + '.peoplebase.test/admin'" class="btn btn-default btn-primary inline-flex items-center relative" target="_blank">Backend</a>
        <a href="http://foo.peoplebase.test/" class="btn btn-default btn-primary inline-flex items-center relative" target="_blank">Settings</a>
    </div>
</card>
</template>

<script>
   export default {
 props: [
    'card',

    // The following props are only available on resource detail cards...
    // 'resource',
    // 'resourceId',
    // 'resourceName',
],

mounted() {
    //
  },
}
</script>

第三个 link 上的正常 href 工作正常，但 dynaimc :href 不工作。

我在这里错过了什么？

Answer 1

你打错字了！这就是它没有按预期工作的原因！

<a :href="'http//:'

将 http//: 更改为 http://

<a :href="'http://'

Laravel nova 自定义卡片 vue 文件 - 如何将 href 属性设置为外部 url

Laravel nova custom card vue file - how to set href attribute to external url

laravel

vue.js

laravel-nova