Question

在提出问题之前，我搜索了这个问题并找到this解决方案，但这对我不起作用。

让我们从我在项目中开发的示例开始。我的项目是laravel，所以下面的例子是在刀片文件中。

使用Vue js我得到响应并在模板结构中设置。

<ul>
<li v-for="brand in list">
    @{{brand.name}}
    <a href="#"> // how to create href url from brand name that come from Vue response and I want to replace space(' ' ) with dash( '-') and pass to href url

                       <img :src="brand.image">

    </a>

</li>

让我知道我正在获得brand.name = test demo

使用这个brand.name我想像这样构建href url：href =＆＃34; {{url（＆＃39; brand / test-demo＆＃39;}}＆＃34;。

我想要完成的另一件事是：

想要将此href链接传递给其他Vue http请求，例如

created: function(){

axios.get('brand/test-demo').then(response => this.detail = response.data) ;

}

如何处理这些想法？我什么都不知道？任何帮助都会很棒。

由于

更新：

我尝试了以下方法但没有工作。

<a :href="{{url('brand/' + brand.name}} ">

<a :href="{{url('brand/'}}" + brand.name ">

但是当我通过完整网址时，它的工作方式如下：

<a :href="'http://localhost/gift_india/' + brand.name "> // // this one work but I want dynamic URL.

Answer 1

不要想太多，只需为此编写辅助函数。

function url (str) {
  return str.replace(/\s+/g, '-')
}

并将此功能注入Vue

Vue.prototype.url = url

然后你可以在你的模板中随处使用这个功能

Vue js - 如何从Vue数据响应创建href链接并传递给下一个请求？

1 个答案: