Vue v-for嵌套數據渲染問題

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",  []);
            }
        });
}