質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

241閲覧

React: ラジオボタンでフィルターしたいがやり方が分からない

vankick

総合スコア22

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2019/04/24 06:26

やりたいこと:

Reactです。
JSONファイルから読み込んだデータがあります。

[ { "id": "1", "name": "Blue Shirt", "price": "$4.99", "image": "shirt01.jpg", "size": "S", "category": "shirt" }, { "id": "2", "name": "Winter Shirt", "price": "$10.99", "image": "skirt03.jpg", "size": "L", "category": "skirt" }, { "id": "3", "name": "Black Jacket", "price": "$44.99", "image": "shirt03.jpg", "size": "S", "category": "jacket" }, { "id": "4", "name": "Blue Medium Shirt", "price": "$6.99", "image": "pants01.jpg", "size": "M", "category": "pants" } ]

ラジオボタンのvalueを使用し、Size: S のものだけを表示させたり、Category: Shirt のものだけを表示させたいと思っています。

これの実現に関して、日本語でも英語でも2日以上やり方を調べているのですが、一向に情報を見つけることが出来ません。

どなたか、参考になるサイトやページなどご存知の方がいらっしゃったら、教えていただけないでしょうか。

すみませんが、よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

大きな機能としてやり方がわからない場合は、細かく分けて考えることが有効です(ピタリ同じ課題に遭遇するケースも、なかなかありませんし)。

この場合、大きく分けると、以下のようになります。

  1. ラジオボタンを表示して、値を管理する
  2. 配列データから、条件にあったものを検索する
  3. 絞り込んだ結果をReactで表示する

少しずつやっていけば、いつの間にか出来上がっています。

投稿2019/04/24 06:47

maisumakun

総合スコア145121

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問