vue 递归实现穷举

时间:2019-10-24
本文章向大家介绍vue 递归实现穷举,主要包括vue 递归实现穷举使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
new Vue({
    el: '#app',
    data: {
        tr:[
            {
                key:'color',
                name:'颜色',
                data:['红色','黄色','蓝色'],
            },
            {
                key:'age',
                name:'年龄段',
                data:['5岁','10岁','15岁'],
            },
            {
                key:'price',
                name:'价格',
                data:['11','12','13'],
            },
            {
                key:'num1',
                name:'数量',
                data:[1,2,3],
            },
            {
                key:'diqu',
                name:'地区',
                data:['河南','江苏','安徽'],
            },
        ],
        allData:[],
    },
    methods: {
        formattingData:function(all,k,data,obj,arr_data){
            if(k==all){
                let json_obj = JSON.stringify(obj);
                this.allData.push(json_obj);
                return false;
            }else{
                var v = k+1
                for (var i in data[k].data) {
                        obj[data[k].key] = data[k].data[i]
                    this.formattingData(all,v,data,obj);
                }
            }
        },
    },
      computed: {
        // 计算属性的 getter
        countData: function () {
            this.allData = [];
            let tr = this.tr
            let num = tr.length
            // console.log(num);
            var arr_data = [];
            let obj = {};
            this.formattingData(num,0,tr,obj,arr_data);
            console.log(this.allData.length);
            return this.allData
        }
      }
})

原文地址:https://www.cnblogs.com/y734290209/p/11730349.html