!704 Vue的DictTag组件,当value没有匹配的值时,展示value

Merge pull request !704 from Aurora/master
This commit is contained in:
若依 2023-04-23 06:53:11 +00:00 committed by Gitee
commit af15a3b274
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
1 changed files with 43 additions and 3 deletions

View File

@ -7,7 +7,7 @@
:key="item.value" :key="item.value"
:index="index" :index="index"
:class="item.raw.cssClass" :class="item.raw.cssClass"
>{{ item.label }}</span >{{ item.label + ' ' }}</span
> >
<el-tag <el-tag
v-else v-else
@ -17,10 +17,13 @@
:type="item.raw.listClass == 'primary' ? '' : item.raw.listClass" :type="item.raw.listClass == 'primary' ? '' : item.raw.listClass"
:class="item.raw.cssClass" :class="item.raw.cssClass"
> >
{{ item.label }} {{ item.label + ' ' }}
</el-tag> </el-tag>
</template> </template>
</template> </template>
<template v-if="unmatch && showValue">
{{ unmatchArray | handleArray }}
</template>
</div> </div>
</template> </template>
@ -33,6 +36,16 @@ export default {
default: null, default: null,
}, },
value: [Number, String, Array], value: [Number, String, Array],
// value
showValue: {
type: Boolean,
default: true,
}
},
data() {
return {
unmatchArray: [], //
}
}, },
computed: { computed: {
values() { values() {
@ -42,7 +55,34 @@ export default {
return []; return [];
} }
}, },
unmatch(){
this.unmatchArray = [];
if (this.value !== null && typeof this.value !== 'undefined') {
//
if(!Array.isArray(this.value)){
if(this.options.some(v=> v.value == this.value )) return false;
this.unmatchArray.push(this.value);
return true;
}
// Array
this.value.forEach(item => {
if (!this.options.some(v=> v.value == item )) this.unmatchArray.push(item)
});
return true;
}
// value
return false;
}, },
},
filters: {
handleArray(array) {
if(array.length===0) return '';
return array.reduce((pre, cur) => {
return pre + ' ' + cur;
})
},
}
}; };
</script> </script>
<style scoped> <style scoped>