Typescriptでreact refを使用する方法

通常、jsx では次のように記述されます。

class Header extends Component<any>{

    myInputRef = React.createRef();
    render(){
        return(
            <div>
                <input type="text" ref={this.myInputRef}/>
            </div>
        )
    }
}

ただし、tsx での型チェックにより、エラーがコンパイルされます。

型 'RefObject<unknown>' は型 'string | ' に割り当てることができません。((インスタンス: HTMLInputElement | null) => void) | RefObject<HTMLInputElement> | ヌル | 未定義'。
タイプ「RefObject<unknown>」をタイプ「RefObject<HTMLInputElement>」に割り当てることはできません。
タイプ「unknown」はタイプ「HTMLInputElement」に割り当てることができません。ts(2322)

エラー メッセージを確認すると、タイプを追加して次のように変更する必要があります。

myInputRef = React.createRef<HTMLInputElement>();

参考：

https://medium.com/@martin_hotell/react-refs-with-typescript-a32d56c4d315