Reactで入力された値を保持させたい

inputに入力された値を保持、表示させる

onChangeイベントとuseStateを利用してinputタグに入力された値を表示させます。

まずはstateを管理するための記述を書きます。

// CDNで React　を利用する場合はReact.useState()と記述します。
const [name, setName] = React.useState('〇〇');

次に現在の状態をセットする関数の定義

const handleOnChange = (event) = setName(event.target.value);

レンダリングするDOMを定義

return (
  <div>
    // changeイベントが発生した時にnameの値をセットする関数を呼び出す
    <input type="text" onChange={handleOnChange} />
    <p>こんにちは、{name}さん</p>
  </div>
);