feat(prop): add propTyps to define props

package.json

@@ -28,6 +28,7 @@
     "pinia": "^2.0.9",
     "vue": "^3.2.25",
     "vue-router": "^4.0.12",
+    "vue-types": "^4.1.1",
     "web-storage-cache": "^1.1.1"
   },
   "devDependencies": {

src/components/Button/src/Button.vue

@@ -3,7 +3,7 @@
  * @Autor: YDKD
  * @Date: 2022-04-01 10:57:59
  * @LastEditors: YDKD
- * @LastEditTime: 2022-04-04 20:02:08
+ * @LastEditTime: 2022-04-07 14:58:26
 -->
 <template>
   <div :class="prefixCls">
@@ -23,24 +23,15 @@ import { defineProps, PropType } from 'vue'
 import { useDesign } from '@/hooks'
 import type { ButtonType } from 'element-plus'
 import type { ButtonSize } from '../types'
+import { propTypes } from '@/utils/propTypes'
 
 const prefixCls = useDesign('prefix', 'button')
 
 const props = defineProps({
-  text: {
-    type: String,
-    default: ''
-  },
-  type: {
-    type: String as PropType<ButtonType>
-  },
-  size: {
-    type: String as PropType<ButtonSize>
-  },
-  icon: {
-    type: String,
-    default: ''
-  }
+  text: propTypes.string.def(''),
+  type: propTypes.oneOf<ButtonType[]>([]).def('primary'),
+  size: propTypes.oneOf<ButtonSize[]>([]).def(),
+  icon: propTypes.string.def('')
 })
 </script>
 

src/components/Icon/src/Icon.vue

@@ -3,7 +3,7 @@
  * @Autor: YDKD
  * @Date: 2022-03-28 15:08:36
  * @LastEditors: YDKD
- * @LastEditTime: 2022-04-01 11:30:33
+ * @LastEditTime: 2022-04-07 14:51:07
 -->
 <template>
   <ElIcon :class="prefixCls" :size="size" :color="color">
@@ -21,24 +21,15 @@ import { defineProps, computed, PropType } from 'vue'
 import { useDesign } from '@/hooks'
 
 import type { IconType } from '../types'
+import { propTypes } from '@/utils/propTypes'
 
 const prefixCls = useDesign('prefix', 'icon')
 
 const props = defineProps({
-  icon: {
-    type: String
-  },
-  color: {
-    type: String
-  },
-  size: {
-    type: Number,
-    default: () => 16
-  },
-  type: {
-    type: String as PropType<IconType>,
-    default: () => 'iconify'
-  }
+  icon: propTypes.string.def(''),
+  color: propTypes.string.def(''),
+  size: propTypes.number.def(16),
+  type: propTypes.oneOf<IconType[]>(['iconify', 'iconfont']).def('iconify')
 })
 
 const iconfontSize = computed(() => {

src/components/foss-bg/index.vue

@@ -12,16 +12,13 @@
 
 <script lang="ts" setup>
 import { useDesign } from '@/hooks'
+import { propTypes } from '@/utils/propTypes'
 import { defineProps, withDefaults } from 'vue'
 
 const prefixCls = useDesign('prefix', 'bg-panel')
 
-interface Props {
-  headerText?: string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  headerText: '登录'
+const props = defineProps({
+  headerText: propTypes.string.def('登录')
 })
 </script>
 

src/utils/propTypes.ts

@@ -0,0 +1,22 @@
+/*
+ * @Version: 1.0
+ * @Autor: YDKD
+ * @Date: 2022-04-06 11:53:02
+ * @LastEditors: YDKD
+ * @LastEditTime: 2022-04-06 13:39:08
+ */
+
+import { createTypes, VueTypesInterface } from 'vue-types'
+
+type PropTypes = VueTypesInterface
+
+const propTypes = createTypes({
+  func: undefined,
+  bool: undefined,
+  string: undefined,
+  number: undefined,
+  object: undefined,
+  integer: undefined
+}) as PropTypes
+
+export { propTypes }

src/views/components/EditForm/index.vue

@@ -3,7 +3,7 @@
  * @Autor: YDKD
  * @Date: 2022-04-01 15:43:39
  * @LastEditors: YDKD
- * @LastEditTime: 2022-04-05 16:14:48
+ * @LastEditTime: 2022-04-07 14:51:56
 -->
 <template>
   <div :class="[prefixCls, 'mt-4']">
@@ -158,17 +158,13 @@ import {
 } from './hooks'
 
 import type { EditType } from './types'
+import { propTypes } from '@/utils/propTypes'
 
 const prefixCls = useDesign('prefix', 'edit-form')
 
 const props = defineProps({
-  type: {
-    type: String as PropType<EditType>,
-    default: () => 'edit'
-  },
-  queryInfoName: {
-    type: String
-  }
+  type: propTypes.oneOf<EditType[]>(['add', 'edit']).def('edit'),
+  queryInfoName: propTypes.string.def('')
 })
 
 handleInitData(props)

vite.config.ts

@@ -35,7 +35,8 @@ export default defineConfig(({ command, mode }) => {
         'element-plus/es/locale/lang/en',
         '@iconify/iconify',
         '@vueuse/core',
-        'axios'
+        'axios',
+        'vue-types'
       ]
     }
   }