Reactのステートは注意が必要です!
Reactのステートは注意が必要です!Reactを利用してフロントエンドのUI(ユーザーインターフェース)を作ると、変更があった部分だけを書き換えてくれるので便利です。これに関連して、前回投稿した変数の扱いでReactのステートを使う場合には注意する必要があるという話を書きました。これに関しては、ご質問が多かったのでもう少し詳しく書いて行く事にします。この機能を利用するには「ステート(state)」で変数を管理して、ステートの変化のイベントを検出する必要があります。ところが、配列やオブジェクトはReactのステートではイミュータブルではないので、正しく実装しないと意図した動作をしない事があります。入力した文字列を配列に追加するアプリ少し具体的な例で説明をします。 シンプルなあぷりとして、文字列を入力する「input」とボタンのシンプルなフォームでボタンが押されたら、入力された文字列を配列に追加するアプリを考えます。これを、Reactのクラスコンポーネントで書くとimport React from "react";import { produce } from "immer";import "bootswatch/dist/spacelab/bootstrap.min.css";import "./App.css";interface IProps {}interface IState { samples: Array<string>;}class App extends React.Component<IProps, IState> { privat
0