Reactでtoggleを使ったナビゲーション的な機能を作る

スポンサーリンク

今回はReactでボタンによって表示、非表示を切り替えるナビゲーションを作ります!と言っても、React初心者である僕のアウトプットなのですが(笑)

Reactを勉強したいなと思い最近勉強中でして、チュートリアルが終わったのでいろいろ作ってみることにしました!最近Reactを始めたので改善点とかあればご指摘お願いします!

今回は動けばいいなと思ったのでCSSとかの見た目はあまりこだわりませんでしたのでご自由にカスタマイズしていただければと思います。(._.)

以下、ソースコードです!

本当にシンプルなコードになっていますが、ナビゲーションの表示を切り替えることができました。これをindex.htmlやindex.js等で表示してみてください!

Reactではmapメソッドを使って配列を操作する処理が多いと思いました。また、クラスを使うことでstateに状態を保持できます。個人的にはView.jsよりも難しいのかなーといったところですが、バイト先で使っているのがReactなのでもっと上達して貢献していきたいと思ったり。

もっと、勉強してレベルの高いアウトプットができるようにしたいですね、、、自分の成長記録としてこれから記録していこうと思います。

著者プロフィール
この記事を書いた人
RIO

大学で有機化学を専攻していた人 / 修士→博士→化学メーカー研究職 / 大学院での経験、研究職の仕事、勉強記事など発信していきます! / 学部時代は企業でプログラミング業務のインターンシップをしてました

RIOをフォローする
Reactプログラミング
スポンサーリンク
RIOをフォローする
スポンサーリンク

コメント

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