element ui级联选择器回显数据格式 element ui select 联动

第一次遇见这个问题，也是困扰了我很久，本来就是个很基础的问题，数组新增对象，判断是否有该对象，没有就新增，有则不变。

需求如下：select选择器多选状态下，选取谁就把谁push到对应的表格内，且表格中原有对象的数据不能变。(自己做的第一版很基础，就单纯的一个联动效果，效果如下)

实现联动主要是select选择器的change事件

这一版本就没有想到如果每次新增一个对象的时候，前一个对象的会被重新赋值，直到后来才发现；

中间采用其他方法的时候就有出现了bug在我顺着选取select选择器里面的值的时候，表格无异样，当我随机取消第一个后面的值（如2实操）再新增到表格中，就会有冲突

效果图如下

这里就会发现是不是重复出现了一个对象且第一个还没有push进去。。。。。我不李姐😥😥😥，看了好几遍select选择器打印的数据都无异样，偏偏表格不符合，如有大神知道什么什么原因也可讲解一下，小白愿意洗耳恭听🙏🙏🙏

第二张图片是我做的最后一次有bug的表格，更多的还是希望大神们可以指导一下，虽然问题解决了，但还是在这一方面上欠缺，也希望自己下次再遇到相同问题的时候不会被自己整的bug整成无解。

最后呢，我找同事一起帮助我看这个问题，然后问题就解决了，现在无论新增还是减少，表格都不会有问题，（大家都知道select选择器返回的是一个数组，我需要每个实操的id并且通过这个id对比查找下拉菜单这个数组，返回对应的名字和id，也就是表格需要的对象）
自己最终的解决代码放在下面了，欢迎大神指点

subjectIdList: [
  { key: "asfdgertge1", value: "1实操" },
  { key: "ferwdf34625", value: "2实操" },
  { key: "eawr346gr5g", value: "23实操" },
 ],
changeMultiple(val) {
if (val.length != 0) {
	//  表格数据增加判断
	if (val.length > this.classList.length) {
		var list = [];
		this.subjectIdList.forEach((item) => {
		if (val.indexOf(item.key) > -1) {
    		list.push(item);
		}
		});
	
		if (this.classList.length) {
			list.map((item) => {
        		var flag = false;
            	for (let i of this.classList) {
            		if (item.key == i.courseId) {
                    	flag = true;
                  	}
             	}
            	if (!flag) {
            		this.classList.push({
                		courseId: item.key,
                		courseName: item.value,
                		menuModel: 1,
                    	classHourModel: 1,
                    	limitHour: true,
                    	courseMinute: null,
                    	courseNum: null,
                    	status: true, // 控制删除
                    	deleted: false,
                  	});
                 }
              });
            } else {
              this.classList = [
                {
                  courseId: list[0].key,
                  courseName: list[0].value,
                  menuModel: 1,
                  classHourModel: 1,
                  limitHour: true,
                  courseMinute: null,
                  courseNum: null,
                  status: true,
                  deleted: false,
              	},
         	];
      	}
      }
      	// 减少数据表格判断
      if (val.length < this.classList.length) {
      		var bb = [];
      		this.subjectIdList.map((item) => {
              if (val.indexOf(item.key) == -1) {
                bb.push(item.key);
              }
            });
            bb = Array.from(new Set(bb));
            var arr = [];
            this.classList.forEach((a) => {
              if (bb.indexOf(a.courseId) == -1) {
                arr.push(a);
              }
            });
            this.classList = arr;
      	}
	}else{
		this.classList=[]
	}
},

以上就是实现成功的代码，给数组新增对象且不会改变原数组其他对象的值，并且也不会出现我之前的那种情况了😰
如果有其他想法的可以留言，我参考参考丰富自己的阅历及经验，也感谢我的同事帮的忙