【代码优化】DictTag 的 render 方法的命名,属性的命名

This commit is contained in:
YunaiV
2024-08-08 23:47:23 +08:00
parent f7d31d5c99
commit de9ec95099

View File

@@ -17,12 +17,12 @@ export default defineComponent({
required: true required: true
}, },
// 字符串分隔符 只有当 props.value 传入值为字符串时有效 // 字符串分隔符 只有当 props.value 传入值为字符串时有效
sepSymbol: { separator: {
type: String as PropType<string>, type: String as PropType<string>,
default: ',' default: ','
}, },
// 每个tag之间的间隔默认为5px // 每个 tag 之间的间隔,默认为 5px,参考的 el-row 的 gutter
tagSpacing: { gutter: {
type: String as PropType<string>, type: String as PropType<string>,
default: '5px' default: '5px'
} }
@@ -35,7 +35,7 @@ export default defineComponent({
} }
// 2.是字符串(进一步判断是否有包含分隔符号 -> props.sepSymbol // 2.是字符串(进一步判断是否有包含分隔符号 -> props.sepSymbol
else if (isString(props.value)) { else if (isString(props.value)) {
return props.value.split(props.sepSymbol) return props.value.split(props.separator)
} }
// 3.数组 // 3.数组
else if (isArray(props.value)) { else if (isArray(props.value)) {
@@ -43,7 +43,7 @@ export default defineComponent({
} }
return [] return []
}) })
const rederDictTag = () => { const renderDictTag = () => {
if (!props.type) { if (!props.type) {
return null return null
} }
@@ -58,7 +58,7 @@ export default defineComponent({
class="dict-tag" class="dict-tag"
style={{ style={{
display: 'flex', display: 'flex',
gap: props.tagSpacing, gap: props.gutter,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center' alignItems: 'center'
}} }}
@@ -84,7 +84,7 @@ export default defineComponent({
</div> </div>
) )
} }
return () => rederDictTag() return () => renderDictTag()
} }
}) })
</script> </script>