如何从返回的数据组件vuejs拼接子数组?

时间:2017-07-17 18:50:40

标签: javascript arrays vuejs2 array-splice

我有一个数组列表对象......

enter image description here

..这是来自prop的声明js中声明的数据:

    data: function(){
    return{
        listaSelezionati:this.selezionati
    }
}

..在v-for

上呈现
<div class="row" style="margin-bottom:20px;" v-for="(selezionato,index) in listaSelezionati">

..在这个for循环中有一个调用函数的按钮

<div class="remove pull-right" v-on:click="rimuovi(index)"></div>

..使用此函数我想拼接对象的子数组&#34; listaSelezionati&#34;使用&#34; index&#34;,但我不确定该怎么做..

这里我尝试过:

    methods:{
    rimuovi : function(index){
        alert(index);
        return{
            this.listaSelezionati[index][0].splice(index,1)
        }
    }
}

但它什么也没做,任何人都有建议吗?

EDIT1 我想知道return{this.listaSelezionati是否应该是编辑组件数据的正确方法

2 个答案:

答案 0 :(得分:0)

看起来你的阵列太深了。

this.listaSelezionati[index]

是一个数组,但

this.listaSelezionati[index][0]

看起来像是一个Object的数组的第一个元素。所以现在看起来你在一个位置索引处拼接一个Object。这应该会产生错误。 我想你需要:

rimuovi : function(outterIndex, innerIndex){
    alert(outterIndex, innerIndex);
    return{
        this.listaSelezionati[outterIndex].splice(innerIndex,1)
    }
}

<div class="remove pull-right" v-on:click="rimuovi(index, innerIndex)"></div>
// or
<div class="remove pull-right" v-on:click="rimuovi(outterIndex, innerIndex)"></div>

我还没有对它进行测试,但至少它应该让你更接近

答案 1 :(得分:0)

如果你想通过索引删除整个子数组,你需要做的就是:

methods:{
  rimuovi : function(index){
    this.listaSelezionati.splice(index,1)
  }
}

无需返回值; splice更新调用它的数组。