vue 3 复用 props 类型.md

参考 element plus，很巧妙地使用动态类型定义，同时使用 ExtractPropTypes 得到静态类型。

packages/components/radio/src/radio.ts:

// buildProps 的实现比较复杂，可以直接拿来使用就行了，就是对类型做了优化，有了静态类型类似 `PropType<string>`
export const radioPropsBase = buildProps({
  size: useSizeProp,
  disabled: Boolean,
  label: {
    type: [String, Number, Boolean],
    default: '',
  },
})
export const radioProps = buildProps({
  ...radioPropsBase,
  modelValue: {
    type: [String, Number, Boolean],
    default: '',
  },
  name: {
    type: String,
    default: '',
  },
  border: Boolean,
} as const)
export type RadioProps = ExtractPropTypes<typeof radioProps>

packages/components/radio/src/radio-button.ts:

import { buildProps } from '@element-plus/utils/props'
import { radioPropsBase } from './radio'
import type { ExtractPropTypes } from 'vue'

export const radioButtonProps = buildProps({
  ...radioPropsBase,
  name: {
    type: String,
    default: '',
  },
} as const)

export type RadioButtonProps = ExtractPropTypes<typeof radioButtonProps>

upupming/vue 3 复用 props 类型.md