vue2.0中el-cascader 父级单选子级多选

最新推荐文章于 2024-06-14 19:23:29 发布

闪电小飞侠.

最新推荐文章于 2024-06-14 19:23:29 发布

阅读量774

点赞数 1

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/lxyxfx/article/details/128215470

版权

//代码



<el-cascader
                placeholder="xxx"
                :options="options"
                v-model="shareScope"
                clearable
                collapse-tags
                :show-all-levels="false"
                size="small"
                ref="dept"
                :props="{ multiple: false, emitPath: false, checkStrictly: true }"
                popper-class="cscaderS"
                @change="selDep"
            ></el-cascader>

data(){
return {
  shareScope: [],
            shareScopeEnd: [],
            result: [],
            brand: 'xxx',
}

  change(val) {
            //是否与上次的类型相同
            let changeFlag = false;
            let changeItem = null;
            if (this.shareScopeEnd.length === 0) {
                this.shareScope = val;
            } else {
                //与原数组比对
                this.shareScope.forEach((item) => {
                    //与原数组的类型相同
                    if (item[0] !== this.shareScopeEnd[0][0]) {
                        changeFlag = true;
                        changeItem = item;
                    }
                });
            }
            if (changeFlag) {
                // 上次是system, 那么这次是domain;
                // if (this.shareScopeEnd[0][0] === 'system') {
                //     this.shareScope = this.shareScope.filter((item) => {
                //         return item[0] !== 'system';
                //     });
                // } else {
                this.shareScope = [];
                this.shareScope.push(changeItem);
                // }
            }
            this.shareScopeEnd = this.shareScope;
            //以下代码 适合参数为字符串使用
            this.result = [];
            this.shareScopeEnd.flat(Infinity).forEach((item) => {
                if (this.result.indexOf(item) == -1) {
                    this.result.push(item);
                }
            });
            this.result = this.result.slice(1);
            this.brand = this.result.join(',');
            if (this.brand != '') {
                this.getOutStuff(); //调用接口
            }
        },