解决vue-area-linkage 无法回显的bug

Posted 2023-02-19 狼丶宇先森

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了解决vue-area-linkage 无法回显的bug相关的知识，希望对你有一定的参考价值。

一、写在前面

最近写的项目,前几天有一个需求是要写省市区联动选择，我们项目组的一个妹子上网搜罗了一遍之后发现了vue-area-linkage这个插件，应该是专门为vue准备的省市区插件。

但是后面发现这插件有个数据无法回显的bug.

二、内容部分

将源码下载到本地跑了一遍,发现两个地方的代码没执行,导致默认值无法显示,就无法回显了.

下面两段代码是已经修改过后的,

1.移除 if (!this.isSetDefault && isArray(val) && val.length === this.level + 2) 此判断条件中的取反!.

 watch: 
        value (val) 
            if (this.isSetDefault && isArray(val) && val.length === this.level + 2) 
                this.beforeSetDefault();
                this.setDefaultValue();
            

            if (!this.isSetDefault && isArray(val) && val.length && val.length !== this.level + 2) 
                assert(false, `设置的默认值和 level 值不匹配`);
            
        ,

2.setDefaultsCodes () 方法中的第一段判断条件即可.

  setDefaultsCodes () 
            //这段代码有bug，默认值设置无法更新
            // if (this.isSetDefault) 
            //     return;
            // 
            this.isSetDefault = true;

            let codes = [];
            switch (this.level) 
                case 0:
                    codes = [this.curProvinceCode, this.curCityCode];
                    break;
                case 1:
                    codes = [this.curProvinceCode, this.curCityCode, this.curAreaCode];
                    break;
                case 2:
                    codes = [this.curProvinceCode, this.curCityCode, this.curAreaCode, this.curStreetCode];
                    break;
            
            this.defaultsAreaCodes = [].concat(codes);