ref

なにこれ

ref は、props 以外で子コンポーネントとインタラクションできる方法。

DOMノード or コンポーネントへの参照を取得できるよ

どうする

1. まず参照をつくる

code:ts

class Sample extends React.Component {

constructor(props: any) {

super(props);

// refを作るゾ

this.myRef = React.createRef();

}

}

2. DOM（もしくはコンポーネント）に参照指定させる

code:ts

class Sample extends React.Component {

render () {

return (

<input type="text" ref={this.myRef} onChange={this.onChange} />

)

}

}

3. つかう

code:ts

class Sample extends React.Component {

private const onChange = () => {

// なんとrefで指定したDOMにアクセスできる

this.myRef.current.focus();

}

}

Hooks

いまはこっち。

あとrefにはuseRef or createRef した以外のモノも入れられる