对于二次封装 html 元素只向外暴露了部分原生属性的问题

[lilmonix2]

拜读代码时看到了这样的写法。

type NativeButtonProps = DetailedHTMLProps<
  ButtonHTMLAttributes<HTMLButtonElement>,
  HTMLButtonElement
>

export type ButtonProps = {
  color?: 'default' | 'primary' | 'success' | 'warning' | 'danger'
  // ... 省略
  children?: ReactNode
} & Pick<
  NativeButtonProps,
  'onMouseDown' | 'onMouseUp' | 'onTouchStart' | 'onTouchEnd' | 'id'
> &
  NativeProps<
    | '--text-color'
    // ... 省略
    | '--border-color'
  >

想请教一下为什么选择使用使用 Pick 将部分原生 button 的部分属性暴露给外界更改，而不是将自定义的属性提取出来后，将剩余所有的原生属性解构赋值给 button。
一直没想明白这样做的优势是什么，亦或者是开发的时候遵循了某些开发的原则之类的？

谢谢！

[zombieJ]

API 暴露出去很难收回来，二次封装的组件不一定方法和原生是一致的。比如说各种输入型组件的 onChange 事件，对应到原生是 e.target.value 获取值，但是封装的组件不一定有这个 event 对象。某天另一个组件决定添加 onInput 然后发现已经被原生暴露出去了，就会导致这个 API 实际上废掉了（原因相同封装组件没有 event 对象）。

[lilmonix2]

好的，谢谢您的解答！祝您工作生活顺利！