vue 操作多维数组

原来有使用elemgnt ui来实现编辑图片就需要用到多维数组

陷入了一个误区，多维数组的初始化，然后要使用的是二维数字

我使用的是 xxlist:[[]],

额~

---

没有理解到位，结果定义成了a[0]=[];

相当于这种类型的

然后用昨天需要实现兑换奖品就需要传入prizeList的json对象

虽然花的时间比较久，但是实现一次下次就容易很多了，我贴一下代码

         <el-dialog

              title="新增奖品数量"

              :visible.sync="voteuserDialog"

              custom-class="csvoteuseDialog"

              size="small">

              <el-form  label-width="80px" ref="voteuserForm" :model="voteuserForm">

                  <el-form-item :label="item.name" prop="prizenum" v-for="(item,index) in prizelist">

                    <el-input v-model="voteuserForm.prizenum[index]">

                            <template slot="append">个</template>

                    </el-input>

                  </el-form-item>

                </el-form>

              <div slot="footer" class="dialog-footer">

                <el-button @click="voteuserDialog = false">取 消</el-button>

                <el-button type="primary" @click="addVoteuser('voteuserForm')">保 存</el-button>

              </div>

            </el-dialog>

兑奖弹窗因为可能有多个奖品所以需要用到 index值

voteuserForm: {

                prizename:[],

                prizenum:[],

            },

定义对象的数组

 addPrizeNum(){

            let self = this;

            self.voteuserDialog = true;

            for(var i in self.prizelist){

                self.voteuserForm.prizenum[i]='';

            }

        },

触发弹窗的时候置空上次可能输入的值，清空

addVoteuser(formName){

                let self = this;

                        self.voteuserDialog = false;

                        for(var h in self.voteuserForm.prizenum){

                            if(self.voteuserForm.prizenum[h]){

                                var regNo = /^\d+$/;

                                if(!regNo.test(self.voteuserForm.prizenum[h])){

                                    this.$message.error('请输入整数');

                                    return;

                                }else if(self.voteuserForm.prizenum[h]>3000){

                                    this.$message.error('奖品数量应小于3000');

                                    return;

                                }

                               }

                            }

                        console.log('prizenum=========',self.voteuserForm.prizenum);

                        self.adprizelist =[];

                        console.log('prizelist.length==========',self.prizelist.length);

                        var num=0;

                        var nums=[];

                        for(var c=0;c<self.prizelist.length;c++){

                           if(self.voteuserForm.prizenum[c]){

                                nums[num] = c;

                                num = num+1;

                            }   

                            else{

                                console.log(self.voteuserForm.prizenum[c]);

                            }                       

                        }   

                        console.log('num================',num,'nums========'+nums);

                        for(var i=0;i<num;i++){

                            self.adprizelist[i] = [];

                            self.adprizelist[i].prizename = self.prizelist[nums[i]].name;

                            self.adprizelist[i].pid = self.prizelist[nums[i]].id;                           

                            self.adprizelist[i].num = self.voteuserForm.prizenum[nums[i]];                           

                            console.log('adprizelist',self.adprizelist[i])

                        }

                        var jsonprizelist = {};

                        for(var i=0;i<self.adprizelist.length;i++)

                        {

                            jsonprizelist[i]={};

                                jsonprizelist[i].prizename='';

                                jsonprizelist[i].pid='';

                                jsonprizelist[i].num='';

                                jsonprizelist[i].prizename=self.adprizelist[i].prizename;

                                jsonprizelist[i].pid=self.adprizelist[i].pid;

                                jsonprizelist[i].num=self.adprizelist[i].num;

                        }

                        console.log('adprizelist=======',self.adprizelist);

                        var sendData = {

                            "uid": self.getSessionStorage('login').userinfo.id,

                            "token": self.getSessionStorage('login').token,

                            "prizelist": JSON.stringify(jsonprizelist),

                        };

                        console.log('jsonprizelist',jsonprizelist);

                        if(num==0){

                            this.$message('请输入奖品数量');

                        }else{

                            self.requestAxios('p', self.action.addprizenum, sendData, 'loading', '错误提示', '新增投票失败', 'addprizenumCallBack');

                        }

            },           

            addprizenumCallBack() {

                let self = this;

                self.sendMsgBoxOk(self.result.msg, '新增奖品数量成功', '新增奖品数量成功啦');

                self.initList();

            },

主要的代码就是实现装入多维数组的

self.adprizelist[i] = [];

                            self.adprizelist[i].prizename = self.prizelist[nums[i]].name;

                            self.adprizelist[i].pid = self.prizelist[nums[i]].id;                           

                            self.adprizelist[i].num = self.voteuserForm.prizenum[nums[i]];   

将一维数组下的元素继续定义为数组就可以实现了

然后多维数组转json对象也跟这个流程差不多呐

 var jsonprizelist = {};

                        for(var i=0;i<self.adprizelist.length;i++)

                        {

                            jsonprizelist[i]={};

                                jsonprizelist[i].prizename='';

                                jsonprizelist[i].pid='';

                                jsonprizelist[i].num='';

                                jsonprizelist[i].prizename=self.adprizelist[i].prizename;

                                jsonprizelist[i].pid=self.adprizelist[i].pid;

                                jsonprizelist[i].num=self.adprizelist[i].num;

                        }

json对象下的元素继续定义为一个对象然后得到了jsonprizelist

在传递数据的时候通过

JSON.stringify(jsonprizelist)；

方法转化为json对象