React inputのvalueを表示する

備忘録
inputの内容をテキストで表示する。
変更があった場合もすぐに反映したい。

//useStateをインポートする（ないとエラーになる）
import { useState } from "react";

const Child = ()=>{
//textという変数を用意
//setTextで更新していくよ、初期値は""
    const [text,setText] = useState("");
    return(
        <>
            <input 
                type="text"
                value={text} 
                onChange={(event)=>setText(event.target.value)} />  
            <h1>{text}</h1>
        </>
    )
}
export default Child

valueにstateの変数を指定することで、stateのtextとして取得できるようになる。
onChanegeでsetText（textを更新できる関数）が呼ばれる。
setTextの内容は、変更があったinputのvalueとしてtext変数を更新できる。