javascript - VUE v-for多層嵌套循環怎么取父級的值啊

問題描述

VUE

我想點擊刪除可以刪除當前值，怎么實現?。恐x謝大家。

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){} });}, }}

問題解答

<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'> <-- 在這兒點擊傳入cid,其他同理 --> <a @click='DELlist1(list1.cid)'>刪除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>