gx

src/components/scIconSelect/index.vue

@@ -9,7 +9,7 @@
 
 <template>
 	<div class="sc-icon-select">
-		<el-input v-model="defaultValue" :prefix-icon="defaultValue||'none'" :placeholder="placeholder" :clearable="clearable" :disabled="disabled">
+		<el-input v-model="defaultValue" :prefix-icon="defaultValue||'none'" :placeholder="placeholder" :clearable="clearable" :disabled="disabled" @clear="onClear" @change="onChange">
 			<template #append><el-button icon="el-icon-more" @click="open"></el-button></template>
 		</el-input>
 		<el-dialog title="图标选择器" v-model="dialogVisible" :width="780" destroy-on-close>
@@ -42,7 +42,7 @@
 		props: {
 			modelValue: { type: String, default: "" },
 			placeholder: { type: String, default: "请输入或者选择图标" },
-			clearable: { type: Boolean, default: false },
+			clearable: { type: Boolean, default: true },
 			disabled: { type: Boolean, default: false },
 		},
 		data() {
@@ -75,12 +75,21 @@
 				this.dialogVisible = true
 			},
 			selectIcon(e){
+				console.log(111,e)
 				if(e.target.tagName != 'I'){
 					return false
 				}
 				this.defaultValue = e.target.className
 				this.dialogVisible = false
 				this.$emit('update:modelValue', this.defaultValue);
+			},
+			onClear() {
+				this.$emit('update:modelValue', this.defaultValue);
+			},
+			onChange() {
+				if(this.defaultValue == ''){
+					this.$emit('update:modelValue', this.defaultValue);
+				}
 			}
 		}
 	}