多选下拉菜单后端用string类型接收解决办法:lodash 深拷贝

新建一条表单记录,里面存在多选下拉菜单,点击保存需要将多选下拉菜单转变成string类型.
回到列表页,点击查看,回显时,为了保证能够正确回显需要将后端返回string类型的两个字段转变成数组类型
再次点击保存,提交的就是数组类型和后端不对应就会报错.

解决办法
再次点击保存时,深拷贝一份表单对象值,判断下拉菜单值是否为数组,是就转变成string,将拷贝的对象作为保存接口的入参.

// 基本信息保存
        saveform(val) {
            console.log(val)
            let val2 = _.cloneDeep(val)
            if(Array.isArray(val2.dispatchVehicle) || Array.isArray(val2.driver)){
                val2.dispatchVehicle = val2.dispatchVehicle.join(",")
                val2.driver = val2.driver.join(",")
            }
            if (val.id) {
                carSendupd(val.id, val2).then((res) => {
                    if (res.data.code == 200) {
                        this.$message.success(res.data.message);
                        this.isOpenRegister = false;
                        this.getData();
                        
                    }
                });
            } else {
                val.deleteState = 0;
                carSendadd(val).then((res) => {
                    if (res.data.code == 200) {
                        // this.isOpenRegister = false;
                        console.log(res.data.data)
                        this.getData();
                        this.applydata = res.data.data;
                        this.$message.success(res.data.message);
                        this.isShowPushBtn = false;
                        
                    }
                });
            }
        },
//回显
async getdetail(val) {
            return carSenddetail(val.id).then((res) => {
                if (res.data.code == 200) {
                    
                    res.data.data.fillingTime    = getNowHumanFormat(
                        res.data.data.fillingTime
                    );
                    res.data.data.departureTime  = getNowHumanFormat(
                        res.data.data.departureTime
                    );
                    res.data.data.collectionTime = getNowHumanFormat(
                        res.data.data.collectionTime
                    );
                   
                    if(res.data.data.dispatchVehicle !== "" && res.data.data.dispatchVehicle.length !== 0){
                        res.data.data.dispatchVehicle = res.data.data.dispatchVehicle.split(",") ?? ""
                    }
                    if(res.data.data.driver !== "" && res.data.data.driver.length !== 0){
                        res.data.data.driver = res.data.data.driver.split(",") ?? ""
                    }
                    let obj = {};
                    obj   = Object.assign(res.data.data, {
                        taskId     : val.taskId,
                        businessKey: val.businessKey,
                    });
                    this.carformdatalist = obj;
                    this.detailid = val;
                }
            });
        },

注意:
??是es11新出的操作符,作用类似于三元表单式,??之前的条件成立,则返回??左侧的值,否则返回右侧的默认值

参考链接:https://www.jianshu.com/p/06ea14f9f19d

猜你喜欢

转载自blog.csdn.net/qq_43907534/article/details/123104096
今日推荐