javascript - VUE v-for多层嵌套循环怎么取父级的值啊
PHP中文网
PHP中文网 2017-07-05 10:58:34
0
1
4202

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){

                }
            });
        },
    }
}
PHP中文网
PHP中文网

认证高级PHP讲师

全部回复(1)
过去多啦不再A梦

雷雷

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板