场景:
项目信息中,总项目需要获取子项目的所有备注信息进行汇总
JS写法:
let vm = document.getElementsByName("online-form")[0].__vue__;
//子表
vm.$watch('data.jzbzfzdzbzd.sub_zbzdzfz',function(newVal,oldVal){
let arraya = data.jzbzfzdzbzd.sub_zbzdzfz;
if(arraya && arraya.length>0){
let sy = "";
for(var i=0;i<arraya.length;i++){
if(""!=data.jzbzfzdzbzd.sub_zbzdzfz[i].xmbz){
if(i!=0){
sy+=",";
}
sy+=data.jzbzfzdzbzd.sub_zbzdzfz[i].xmbz;
}
}
data.jzbzfzdzbzd.xmbz = sy;
}
},{ deep:true});
demo数据结构参考:
{ "jzbzfzdzbzd": { "xmbz": "编号:12544,编号:13258", "xmm": "矿产集团管理平台搭建总项目", "xmjl": "", "sub_zbzdzfz": [ { "xmmc": "山西分部项目", "xmbz": "编号:12544", "xmjl": "", "sub_guid": "8e9e5638-7c97-42dc-ad40-718979f470fb" }, { "xmmc": "邢台分部项目", "xmbz": "编号:13258", "xmjl": "", "sub_guid": "5b59704a-db31-4300-ba63-7ddfe6658fb6" } ], "initData": { "zbzdzfz": { "xmmc": null, "xmbz": null, "xmjl": null } } } }
补充其他写法:
let vm = document.getElementsByName("online-form")[0].__vue__; vm.$watch('data.ccsqmx.sub_ccsqjtmxb', (newVal, oldVal) => { handleJoinGwcode(newVal); handleJoinJplx(newVal); }, { immediate: true, deep: true }) function handleJoinGwcode(newVal) { vm.data.ccsqmx.txrdwb = newVal.map(item => { return item.gwcode }).join(",") } function handleJoinJplx(newVal){ vm.data.ccsqmx.gnwjpdwb = newVal.map(item => { return item.jtlb//子表字段别名 }).unique().join(",")//汇总信息并过滤重复内容 }
let vm = document.getElementsByName("online-form")[0].__vue__; vm.$watch('data.bxdj.sub_clf', (newVal, oldVal) => { handleJoinjpiao(newVal);//机票 handleJoinchechuanpiao(newVal);//车船费 handleJoinshineijiaotong(newVal);//市内交通 handleJoinzhusufei(newVal);//住宿费 handleJoinchuchaibutie(newVal);//出差补贴 handleJoinqita(newVal);//其他 }, { immediate: true, deep: true }) //机票 function handleJoinjpiao(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '1'){ sum += item.zfy } }) vm.data.bxdj.F_jpf = sum } //车船费 function handleJoinchechuanpiao(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '4'||item.fylx == '2'||item.fylx == '3'||item.fylx == '9'||item.fylx == '10'){ sum += item.zfy } }) vm.data.bxdj.F_ccf = sum } //市内交通 function handleJoinshineijiaotong(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '5'){ sum += item.zfy } }) vm.data.bxdj.F_snjtf = sum } //住宿费 function handleJoinzhusufei(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '6'||item.fylx == '7'){ sum += item.zfy } }) vm.data.bxdj.F_zsf = sum } //出差补贴 function handleJoinchuchaibutie(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '8'){ sum += item.zfy } }) vm.data.bxdj.F_ccbz = sum } //其他 function handleJoinqita(newVal) { //debugger let sum = 0 newVal.forEach(item => { if(item.fylx == '11'){ sum += item.zfy } }) vm.data.bxdj.F_qt = sum }