React Reactでstateが絡まってきたのでuseReducerを使う
useReducerを使うコメント消すツールに置換機能を追加しようと思ったときに、絡み合ったuseStateよりも1つのuseReducerを使った方がいいということに思い至ったので、使い所の参考として使用例を記録しておきます。コメント消す...
React
React 
React imgタグの画像を切り替えるとき、アスペクト比を維持しつつリサイズする
1つのimgタグを使って代わる代わる画像を表示するとき、アスペクト比を維持しつつ枠いっぱいに表示する。(Javascript, react)2021/09追記リサイズのことを忘れていた。イベントリスナーを追加してリサイズすればいい:// 結...
React react-springでapiを使う
react-springでspringを再利用する。react-springの大雑把な理解react-springのuseSpringはreactのフックを利用しているので、フックの理解が必要になる。react公式（日本語）: フック早わか...
React react-springまたはreactのカラーコード指定の仕様?に注意する
react-spring?react?のカラーコードの仕様に気を配る問題CSSの色指定の文字列がuseSpringの戻り値のSpringValueのtoでの戻り値に含まれていて、かつ、アニメーションが終わった状態で、コンポーネントの再レンダ...
React create-react-appでのアプリにnode-sassを入れた時のエラー
create-react-appで作成したreactアプリでscssを使おうとしたら、エラーが出たときのメモ2022/03追記: node-sassでなくsassモジュールを使うべき（後述追記参照）環境package.jsonは次の通り: ...
React Reactのサンプルとして連打回数測定器をつくった
Reactサンプル1Reactの色々な機能などを使ってみようかと思い、サンプルを作ってみることにした。基本的にできたものはCodePenに置いておこう。今回は基本的事項の確認として、stateやpropsでのコンポーネント間の変数の受け渡し...
React Reactで親から子のコンポーネントにアクセスする
Reactで親コンポーネントから、子コンポーネントにアクセスする。独立性が下がるが、そうしないと実現できないこともあるので仕方がない。そもそも独立してないような気もするので問題ないか。小規模だし。状況親コンポーネントPでページ全体のthis...
React ReactでsetInterval使用で定期描画する
reactでsetIntervalを使って定期的な描画を行う。調べたところ、コンポーネントをクラスで定義するか関数で定義するかで方法が異なるようだ。クラス定義の場合メソッドとして、componentDidMount()とcomponentW...