Reactの基礎５:フォームの作成 - Qiita
で、変数とその値の更新の関数を宣言できます。setValue(xxx)を実行する度にvalueがxxxに更新されて、それらが宣言された関数(コンポーネント)が再実行されます。例えば次のコードでは画面には返り値のフォームが表示されていて、その入力が更新されるとonChangeの中の関数が呼び出されます。すると、値が更新されて再実行によって更新後の値がコンソールに表示されます。 import React from "react" function App() { const [firstName, setFirstName] = React.useState("") console.log(firstName) function handleChange(event) { setFirstName(event.target.value) } return ( <form> <input typ
Reactの基礎４ - Qiita
の続きです。 ボタン操作 以下のようにしてボタンをクリックして関数を起動させることができます。次のコードではボタンを押すと関数handleClickが実行されて、コンソールに"I was clicked!"と表示されます。 import React from 'react'; import ReactDOM from 'react-dom/client'; function App() { function handleClick() { console.log("I was clicked!") } return ( <div className="container"> <button onClick={handleClick}>Click me</button> </div> ) } const root = ReactDOM.createRoot(document.getEleme
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Reactの基礎１ - Qiita
