注释 ref 回调

Question

将 ref 的回调注释为 HTMLElement 是最好的方法吗？我假设 99% 的时间都是这种类型，不是吗？

https://facebook.github.io/react/docs/more-about-refs.html

https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/no-string-refs.md

<input type="text" ref={(ref: HTMLElement) => this.myTextInput = ref} />

Answer 1

目前，Flow 并不特别了解 ref 属性，并且会让您将 ref 属性 设置为任何值。我找不到 GitHub 跟踪此问题的问题，so I opened one。

因此，就 Flow 而言，它只关心您传递给 ref 参数的表达式类型检查。所以它会让你写

<Foo ref={123} />

但不是

<Foo ref={"boom" * 10} />

我不是 React refs 的专家，但是，是的，听起来确实 input 元素将被传递给 HTMLInputElement，它是 HTMLElement 的子类型。所以使用 HTMLElement 或 HTMLInputElement 应该表达你的意图。