SEMI DESIGN 源码学习（二）输入框

Input 组件位于 packages/semi-ui/input/index.tsx, 它继承于 BaseComponent。

值得关注的是 foundation!: InputFoundation; 属性

constructor(props: InputProps) {
  /// ...
  this.foundation = new InputFoundation(this.adapter);
}

InputFoundation 继承于 BaseFoundation, 它需要传入一个 InputAdapter 用来管理输入框的值，以及处理输入框的事件

后面的方法可以看出组件的事件都是交给 this.foundation 处理的

以下是渲染输入框元素的方法

最后返回一个 div 标签，包括其他的元素

文件默认导出 ForwardInput，一个带有 forwardRef 属性的 Input

inputGroup 是输入框组合，位于packages/semi-ui/input/inputGroup.tsx。

TextArea 组件与 Input 类似，多了用于处理 resize 事件的 _resizeListener 方法，最后渲染的是一个 textarea 标签