使用V型绑定将数据放入属性HREF中的标签A(VUE.JS 2 Laravel 5.3)



这是我的 javascript/vue.js 代码:

        import _ from 'lodash'
        export default{
            props:['campanha'],
            data (){
                return{
                    list:[],
                    filter: '',
                    href: '/campanha/9/edit'
                }
            },
            methods:{
                url: function (href){
                    return '/campanha/'+this.href+'/edit'
                }
            },
            mounted: function (){
                this.list = JSON.parse(this.campanha)
            },
            computed: {
                filteredCampanhas(){
                    var self = this
                    return this.list.filter(function(campanhas) {
                        return campanhas.nome.indexOf(self.filter) > -1
                    })
                }
            }
    }

这是我的 html

<template>
        <div>
            <div class="well">
                <a href="campanha/create" class="btn btn-default" title="Nova Campanha">Novo Cadastro <span class="glyphicon glyphicon-plus" aria-hidden="true"/></a><br></br>
                <input type="text" class="form-control" placeholder="Filtrar Campanhas" v-model="filter">
            </div>
            <div class="table-responsive">
                <table class="table table-borderless">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Nome</th>
                            <th>Data Início</th>
                            <th>Data Término</th>
                            <th>Hora Inícío</th>
                            <th>Hora Término</th>
                        </tr>
                    </thead>
                    <tbody>
                        <!--{{ url('/campanha/' . $item->id_campanha . '/edit') }}
                         href: '/campanha/9/edit'
                            <td><a v-bind:href="href">{{ c.nome }}</a></td>
                        !-->
                        <tr v-for="c in filteredCampanhas">
                            <td>{{ c.id_campanha }}</td>
                            <td><a :href="url(c.id_campanha)">{{ c.nome }}</a></td>
                            <td>{{ c.data_inicio }}</td>
                            <td>{{ c.data_termino }}</td>
                            <td>{{ c.hora_inicio }}</td>
                            <td>{{ c.hora_termino }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        <div>

</template>

我试图将一些数据放入标签A的HREF部分,以链接到另一个页面,但它不起作用。

尝试以下:

methods:{
    url: function (href){
        return '/campanha/'+ href+'/edit'
    }
},

当您使用this.href时,它将开始从VUE实例的数据中选择href

最新更新