From 92b2b489a40121a98417cabcfe644ddf80d039cd Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期四, 14 九月 2023 17:22:36 +0800 Subject: [PATCH] fix 修复 自定义字典样式不生效的问题 --- src/components/DictTag/index.vue | 48 ++++++++++++++++++------------------------------ 1 files changed, 18 insertions(+), 30 deletions(-) diff --git a/src/components/DictTag/index.vue b/src/components/DictTag/index.vue index 08aef21..1057b3f 100644 --- a/src/components/DictTag/index.vue +++ b/src/components/DictTag/index.vue @@ -2,7 +2,8 @@ <div> <template v-for="(item, index) in options"> <template v-if="values.includes(item.value)"> - <span v-if="item.elTagType == 'default' || item.elTagType == ''" :key="item.value" :index="index" :class="item.elTagClass"> + <span v-if="(item.elTagType == 'default' || item.elTagType == '') && (item.elTagClass == '' || item.elTagClass == null)" + :key="item.value" :index="index" :class="item.elTagClass"> {{ item.label + " " }} </span> <el-tag @@ -37,46 +38,33 @@ value: [Number, String, Array] as PropType<number | string | Array<number | string>>, // 褰撴湭鎵惧埌鍖归厤鐨勬暟鎹椂锛屾樉绀簐alue showValue: propTypes.bool.def(true), + separator: propTypes.string.def(","), }); - const values = computed(() => { - if (props.value !== null && typeof props.value !== "undefined") { - return Array.isArray(props.value) ? props.value : [String(props.value)]; - } else { - return []; - } + if (props.value === '' || props.value === null || typeof props.value === "undefined") return [] + return Array.isArray(props.value) ? props.value.map(item => '' + item) : String(props.value).split(props.separator); }); const unmatch = computed(() => { - if (props.value !== null && typeof props.value !== "undefined") { - // 浼犲叆鍊间负闈炴暟缁� - if (!Array.isArray(props.value)) { - if (props.options.some((v) => v.value == props.value)) { - return false; - } - return true; + if (props.options?.length == 0 || props.value === '' || props.value === null || typeof props.value === "undefined") return false + // 浼犲叆鍊间负闈炴暟缁� + values.value.forEach(item => { + if (!props.options.some(v => v.value === item)) { + return true // 濡傛灉鏈夋湭鍖归厤椤癸紝灏嗘爣蹇楄缃负true } - return true; - } - // 娌℃湁value涓嶆樉绀� - return false; + }) + return false // 杩斿洖鏍囧織鐨勫�� }); const unmatchArray = computed(() => { // 璁板綍鏈尮閰嶇殑椤� const itemUnmatchArray: Array<string | number> = []; - if (props.value !== null && typeof props.value !== "undefined") { - // 浼犲叆鍊间负闈炴暟缁� - if (!Array.isArray(props.value)) { - itemUnmatchArray.push(props.value); - } else { - // 浼犲叆鍊间负Array - props.value.forEach((item) => { - if (!props.options.some((v) => v.value == item)) { - itemUnmatchArray.push(item); - } - }); - } + if (props.value !== '' && props.value !== null && typeof props.value !== "undefined") { + values.value.forEach(item => { + if (!props.options.some(v => v.value === item)) { + itemUnmatchArray.push(item); + } + }) } // 娌℃湁value涓嶆樉绀� return handleArray(itemUnmatchArray); -- Gitblit v1.9.3