未分類

redux..

投稿日:

reduxについてわかっていることを復習します。reduxは各コンポーネントからstoreに入っているデータから取り出したいデータのオブジェクトを指定して取り出すことができます。reduxのメリットはプロジェクトの規模が大きくなってきたときにもstateの管理を一つのstoreで管理することができるのでスムーズに開発を進めることができます。特徴としてそのままデータを取り出したり更新したりすることができずreducerと呼ばれる関数を用いて取り出し、変更を行います。このreducer関数には引数として第一引数に現在のstate、第二引数にactionを指定します。このactionも関数でtyoeオブジェクトと更新したい値のオブジェクトを返します。各コンポーネントはreact-reduxライブラリが用意しているProviderというコンポーネントの引数でstoreを与えることでProviderコンポーネントの子要素として指定したコンポーネントの中でstoreのデータをいじることができるのですが、ただコンポーネントを指定するだけではなく、そのコンポーネントをconnect関数の第二引数に指定して渡すことができるようになります。まだconnect関数を理解していないのでこれから学びたいと思います。

仮想DOM

仮想DOMはreactで扱うブラウザが読み込むDOMの要素ツリーを模倣した、メモリーに展開されたイミュータブルな要素ツリーです。ブラウザでなんらかのイベントが発生したりしてツリーのどこかの要素の状態が変更されるとそこにリンクされているコンポーネント関数のrenderメソッドが動きます。動いたコンポーネントの子要素のreact elementsに設定されているpropsにも変更が生じるため、そこで新しいpropsが定義されそれが数珠つなぎ状になり、そこで変更された部分のDOMの要素が非同期で変更されます。各コンポーネントが返す要素はhtmlの記述に限りなく近いJSXで記述されるのですが、その正体はReactオブジェクトに格納されているオブジェクト関数です。なのでJSXを記述する際はimportでReactを読み込まないといけません。

-未分類

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

美術の話

 今日は朝は求人関係の作業で終わり、昼過ぎに面接を受け、そのあとはダラダラしていました。本は「片隅の美術と文学の話」を読んでいます。これは芸術家がどんな姿勢で作品と向き合ったいるのかを作家と画家、詩人 …

no image

httpリクエスト

ブラウザが何をしているのかを復習したのでそれについて書きます。ブラウザの上の入力フォームにhttpから始まるurlを入力するとそのurlに紐づいているデータを受け取り、画面に表示させます。その際に受け …

no image

面接!

 明日は面接なので、短めにしたいと思います。今まで面接をしてこなかった人生なので、ここらで鞭を打ちたいと思います。はい、前職では電気工事を行っておりました。具体的には新築建造物や工場などの電気供給に必 …

no image

php

 今日からPHPの学習をはじめました。PHPはwebアプリケーションを作るのに必要なプログラミング言語でrubyと同じくらい使われています。基本的にはjavaと同じように使うことができるみたいで、新し …

no image

反省

今日は色々と反省するべきことがあるのでそれについて書こうと思ったのですが、それよりも勉強のアウトプットをした方が反省になるなと思ったのでそうします。 カレンダーアプリ 今日の実装は予定を入れたらサーバ …