reactjs

React+CSS 要素の位置を選択して切り替える

reactで要素の位置を選択して切り替える。 ReactとCSSでおこなった。 reactで要素の位置を9個の選択肢から選んで変更できるようにする。選択肢は8方向と中央。選択肢の提示方法はCSSで調整した。グリッドレイアウトを使用。...

imgタグの画像を切り替えるとき、アスペクト比を維持しつつリサイズする

1つのimgタグを使って代わる代わる画像を表示するとき、アスペクト比を維持しつつ枠いっぱいに表示する。(Javascript, react) 2021/09追記リサイズのことを忘れていた。イベントリスナーを追加してリサイズすればいい:...

react-springでapiを使う

react-springでspringを再利用する。 react-springの大雑把な理解 react-springのuseSpringはreactのフックを利用しているので、フックの理解が必要になる。react公式（日本語）: フッ...

react-springまたはreactのカラーコード指定の仕様?に注意する

react-spring?react?のカラーコードの仕様に気を配る問題 CSSの色指定の文字列がuseSpringの戻り値のSpringValueのtoでの戻り値に含まれていて、かつ、アニメーションが終わった状態で、コンポーネントの...

create-react-appでのアプリにnode-sassを入れた時のエラー

create-react-appで作成したreactアプリでscssを使おうとしたら、エラーが出たときのメモ環境 package.jsonは次の通り: "dependencies": { // .....

Reactのサンプルとして連打回数測定器をつくった

Reactサンプル1 Reactの色々な機能などを使ってみようかと思い、サンプルを作ってみることにした。基本的にできたものはCodePenに置いておこう。今回は基本的事項の確認として、 stateやpropsでのコンポーネン...

Reactで親から子のコンポーネントにアクセスする

Reactで親コンポーネントから、子コンポーネントにアクセスする。独立性が下がるが、そうしないと実現できないこともあるので仕方がない。そもそも独立してないような気もするので問題ないか。小規模だし。状況親コンポーネントPで...

ReactでsetInterval使用で定期描画する

reactでsetIntervalを使って定期的な描画を行う。調べたところ、コンポーネントをクラスで定義するか関数で定義するかで方法が異なるようだ。クラス定義の場合メソッドとして、componentDidMount()とcomp...

electron環境にwebpackとelectron-connectを足す

electron, react, babel, webpack, gulpの環境にした。今までのものからwebpackを追加した。その理由は、jsxファイルを分割して、他ファイルからrequireするときに、正しくできないた...

electron-reloadとgulp.watchでjsxをホットリロードする

electron-loadとgulpでjsxの変更を即時反映する。 hot reloadとかlive reloadで検索すると、2つのモジュールをよく目にした。 electron-connect - npm electro...

次のページ

12

タイトルとURLをコピーしました