码迷,mamicode.com
首页 > 其他好文 > 详细

Vue v-for嵌套数据渲染问题

时间:2017-11-02 20:11:46      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:style   解决   set   div   amp   new   属性   lis   直接   

Vue v-for嵌套数据渲染问题

问题描述:

由于在获取商品子分类的时候,同时需要获取子分类下的商品,那么多层的列表渲染就只能是第一层好用

问题原因:

vue在处理多层的渲染的时候,不能直接用等号赋值出来的数据,只能是用官方提供的$set方法

解决办法:

在用异步请求数据的时候,返回的时候直接用$set方法给属性赋值。

function ProductTypeSubList(Id) {
    var url = globalUtils.globalHomeUrl + urlConstants.Product.GetProTypeList + "?CustomerID=0&Id=" + Id;
    Vue.http.get(url)
        .then((response) => {
            if (response.data.Code == 0) {
                var ProListUrl = globalUtils.globalHomeUrl + urlConstants.Product.GetProList + "?CustomerID=0&ProTypeId=";
                var ProductTypeSubList = response.data.Data.L_ProTypeList;
                Assort.$set(Assort, "ProductTypeSubList",  ProductTypeSubList);
                ProductTypeSubList.forEach(function(element) {
                    var ProList = new Array();
                    Vue.http.get(ProListUrl + element.Id)
                        .then((response) => {
                            if (response.data.Code == 0) {
                                Assort.$set(element, "ProList", response.data.Data.L_ProList);
                            }
                        });
                }, this);
            } else {
                Assort.$set(Assort, "ProductTypeSubList",  []);
            }
        });
}

 

Vue v-for嵌套数据渲染问题

标签:style   解决   set   div   amp   new   属性   lis   直接   

原文地址:http://www.cnblogs.com/Rexcnblog/p/7773769.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!