Using the React framework, write the web application such that it displays the d

Question

Using the React framework, write the web application such that it displays the data in a tabular format. Each row in the table and the table itself should be React components.

1. Your web application calls a REST API that returns the following data in the JSON format: {"category": "Electronics", "name": "iPad", "price":"$599"], ("category": "Electronics", "name": "iPod", "price":"$199"], {"category": "Electronics", "name": "iPhone", "price":"$899"), {"category": "Computers", "name": "MacBook", "price"."$1299"], "category": "Computers", "name": "Dell XPS", "price": "$999" I1

Explanation / Answer

Array-01.js

[{“category”:”Electronics”,”name”:”iPad”,”price”:”$599”},

{“category”:”Electronics”,”name”:”iPod”,”price”:”$199”},

{“category”:”Electronics”,”name”:”iPhone”,”price”:”$899”},

{“category”:”computers”,”name”:”MacBook”,”price”:”$1299”},

{“category”:”computers”,”name”:”DellXPS”,”price”:”$999”}

]

var dsExample1 = new Spry.Data.JSONDataSet("../../data/json/array-01.js");

...

<div class="liveSample" spry:region="dsExample1">

                <table class="dataTable">

                                <tr>

                                                <th>category</th>

                                                <th>name</th>

                                                <th>price</th>

                                               

                                </tr>

                                <<tr spry:repeat="dsExample1">

                                                <td>{ category }</td>

                                                <td>{name}</td>

                                                <td>{price}</td>

                             </tr>

                </table>

</div>

Related Questions

Navigate

• Browse (All)
• Browse U
• Subjects

---

---

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.