refactor: simplify props definition and optimize types (#1160)

* refactor: simplify rate and result props definition and optimize types * refactor: optimize types --------- Co-authored-by: binbin <binbin@MacBook-Pro.local>
varletjs · Aug 25, 2023 · 18763f6 · 18763f6
1 parent 6957060
commit 18763f6
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 60 deletions.
diff --git a/packages/varlet-ui/src/rate/Rate.vue b/packages/varlet-ui/src/rate/Rate.vue
@@ -84,7 +84,9 @@ export default defineComponent({
       const { modelValue, disabled, disabledColor, color, half, emptyColor, icon, halfIcon, emptyIcon } = props
       let iconColor = color
 
-      if (disabled || form?.disabled.value) iconColor = disabledColor
+      if (disabled || form?.disabled.value) {
+        iconColor = disabledColor
+      }
 
       if (index <= toNumber(modelValue)) {
         return { color: iconColor, name: icon }
@@ -99,16 +101,16 @@ export default defineComponent({
 
     const changeValue = (score: number, event: MouseEvent) => {
       const { half, clearable } = props
+      const { offsetWidth } = event.target as HTMLDivElement
 
-      if (half) {
-        const { offsetWidth } = event.target as HTMLDivElement
-
-        if (event.offsetX <= Math.floor(offsetWidth / 2)) score -= 0.5
+      if (half && event.offsetX <= Math.floor(offsetWidth / 2)) {
+        score -= 0.5
       }
 
-      // set score to 0 when last score is equal to current score
-      // and the value of clearable is true
-      if (lastScore === score && clearable) score = 0
+      // set score to 0 when last score is equal to current score and clearable is true
+      if (lastScore === score && clearable) {
+        score = 0
+      }
 
       // update last score
       lastScore = score

diff --git a/packages/varlet-ui/src/rate/props.ts b/packages/varlet-ui/src/rate/props.ts
@@ -10,59 +10,33 @@ export const props = {
     type: [String, Number],
     default: 5,
   },
-  color: {
-    type: String,
-  },
+  color: String,
   icon: {
     type: String,
     default: 'star',
   },
-  emptyColor: {
-    type: String,
-  },
+  emptyColor: String,
   emptyIcon: {
     type: String,
     default: 'star-outline',
   },
-  size: {
-    type: [String, Number],
-  },
-  gap: {
-    type: [String, Number],
-  },
-  namespace: {
-    type: String,
-  },
-  half: {
-    type: Boolean,
-    default: false,
-  },
+  size: [String, Number],
+  gap: [String, Number],
+  namespace: String,
+  half: Boolean,
   halfIcon: {
     type: String,
     default: 'star-half-full',
   },
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
-  disabledColor: {
-    type: String,
-  },
-  readonly: {
-    type: Boolean,
-    default: false,
-  },
+  disabled: Boolean,
+  disabledColor: String,
+  readonly: Boolean,
   ripple: {
     type: Boolean,
     default: true,
   },
-  clearable: {
-    type: Boolean,
-    default: false,
-  },
-  rules: {
-    type: Array as PropType<Array<(value: any) => any>>,
-  },
+  clearable: Boolean,
+  rules: Array as PropType<Array<(value: any) => any>>,
   onChange: defineListenerProp<(score: number) => void>(),
   'onUpdate:modelValue': defineListenerProp<(score: number) => void>(),
 }
diff --git a/packages/varlet-ui/src/result/props.ts b/packages/varlet-ui/src/result/props.ts
@@ -1,26 +1,15 @@
-import type { PropType } from 'vue'
-
-function typeValidator(type: string) {
-  return ['info', 'success', 'warning', 'error', 'question', 'empty'].includes(type)
-}
+import { type PropType } from 'vue'
 
 export type ResultType = 'info' | 'success' | 'warning' | 'error' | 'question' | 'empty'
 
 export const props = {
-  imageSize: {
-    type: [String, Number],
-  },
+  imageSize: [String, Number],
   type: {
     type: String as PropType<ResultType>,
     default: 'success',
-    validator: typeValidator,
-  },
-  title: {
-    type: String,
-  },
-  description: {
-    type: String,
   },
+  title: String,
+  description: String,
   animation: {
     type: Boolean,
     default: true,