javascript - VUE v-for多层嵌套循环怎么取父级的值啊
VUE
我想点击删除可以删除当前值，怎么实现啊？谢谢大家。
template代码
<p v-for="(list,index) in dylist" :key="list">
<a @click="DEL(index)">删除</a>
<p>{{list.title}}</p>
<p v-for="(list1,index) in list.commentlist" :key="list1">
<a @click="DELlist1(index)">删除1</a>
<p>{{list1.title}}</p>
<p v-for="(list2,index) in list1.answerlist" :key="list2">
<p>{{list2.title}}</p>
<a @click="DELlist2(index)">删除2</a>
</p>
</p>
</p>
JS代码
export default {
data () {
return {
dylist: [{
id: '1',
title: "标题一",
commentlist: [{
cid: "1",
title: "评论一",
answerlist: [{
aid: "1",
title: "回复一"
},
{
aid: "2",
title: "回复一"
}]
}]
},{
id: '2',
title: "标题二",
commentlist: [{
cid: "2",
title: "评论啊啊啊啊啊",
answerlist: []
}]
}]
}
},
methods: {
DEL: function (index) {
var v = this
$.ajax({
async: true,
type: "POST",
url: "del.do",
data: {
"id": v.dylist[index].id /*这样可以拿到最外层的id*/
},
dataType: "json",
success: function(result){
v.dylist.splice(index, 1) ;
}
});
},
DELlist1: function (index) {
var v = this
$.ajax({
async: true,
type: "POST",
url: "DELlist1.do",
data: {
"cid": v.dylist[index].commentlist.cid /*当我需要cid的时候怎么拿呀？*/
},
dataType: "json",
success: function(result){
}
});
},
DELlist2: function (index) {
var v = this
$.ajax({
async: true,
type: "POST",
url: "DELlist1.do",
data: {
"aid": v.dylist[index].commentlist.answerlist.aid /*当我需要aid的时候怎么拿呀？*/
},
dataType: "json",
success: function(result){
}
});
},
}
}
