Explorar o código

完善ElEditTag组件的属性

tongshangming %!s(int64=2) %!d(string=hai) anos
pai
achega
04226c14e3
Modificáronse 1 ficheiros con 16 adicións e 12 borrados
  1. 16 12
      src/components/form/ElEditTag.vue

+ 16 - 12
src/components/form/ElEditTag.vue

@@ -5,9 +5,11 @@ const props = withDefaults(
   defineProps<{
     modelValue: string[] | string
     btnText?: string
+    editable?: boolean
   }>(),
   {
-    btnText: '+ 新增'
+    btnText: '+ 新增',
+    editable: true
   }
 )
 const emits = defineEmits(['update:modelValue'])
@@ -59,22 +61,24 @@ const handleInputConfirm = () => {
       v-for="tag in tagList"
       :key="tag"
       size="small"
-      closable
+      :closable="editable"
       :disable-transitions="false"
       @close="handleClose(tag)"
     >
       {{ tag }}
     </el-tag>
-    <el-input
-      v-if="inputVisible"
-      ref="inputRef"
-      v-model="inputValue"
-      class="ml-1 w-20"
-      size="small"
-      @keyup.enter="handleInputConfirm"
-      @blur="handleInputConfirm"
-    />
-    <el-button v-else class="button-new-tag ml-1" size="small" @click="showInput"> {{ btnText }} </el-button>
+    <template v-if="editable">
+      <el-input
+        v-if="inputVisible"
+        ref="inputRef"
+        v-model="inputValue"
+        class="ml-1 w-20"
+        size="small"
+        @keyup.enter="handleInputConfirm"
+        @blur="handleInputConfirm"
+      />
+      <el-button v-else class="button-new-tag ml-1" size="small" @click="showInput"> {{ btnText }} </el-button>
+    </template>
   </el-space>
 </template>