Obtaining JSON data in React Native without prior knowledge of the key

Question

Obtaining JSON data in React Native without prior knowledge of the key

When I receive this type of data, the keys are common but the items vary. How can I extract and add this data to my list of categories?

{
   "99": "Venues",
   "100": "Party Supplies",
   "101": "Entertainment",
   "102": "Desserts",
   "103": "Catering"
}

This is how I attempted to populate my list:

const dataItem = data.data;
const newList = [];
newList.push({item: dataItem[99]});
newList.push({item: dataItem[100]});
newList.push({item: dataItem[101]});
setList(newList);

But what if the keys are not consistently named? For example:

{
    "S99": "Venues",
    "SDF100": "Party Supplies",
    "CF101": "Entertainment",
    "VF102": "Desserts",
    "CFCV103": "Catering"
}

How can I add this data to my list without knowing the exact key format?

javascript json typescript react-native

Answer 1

Answer №1

To retrieve both key and value, use the code snippet below:

for (var item in info.data) {
   console.log(item); // This will display the key, which could be S99, SDF100, etc.
   console.log(JSON_Object[item]); // This will show the corresponding value for the key.
   updatedList.push({element: info.data[item]});
}

This process allows you to populate your list with additional values.

Answer 2

To retrieve both key and value, use the code snippet below:

for (var item in info.data) {
   console.log(item); // This will display the key, which could be S99, SDF100, etc.
   console.log(JSON_Object[item]); // This will show the corresponding value for the key.
   updatedList.push({element: info.data[item]});
}

This process allows you to populate your list with additional values.

Answer 3

Answer №2

const items = {
 "S99": "Venues",
 "SDF100": "Party Supplies",
 "CF101": "Entertainment",
 "VF102": "Desserts",
 "CFCV103": "Catering"
}

const itemList = Object.values(items);
console.log(itemList);

// displays (5) ['Venues', 'Party Supplies', 'Entertainment', 'Desserts', 'Catering']

Answer 4

const items = {
 "S99": "Venues",
 "SDF100": "Party Supplies",
 "CF101": "Entertainment",
 "VF102": "Desserts",
 "CFCV103": "Catering"
}

const itemList = Object.values(items);
console.log(itemList);

// displays (5) ['Venues', 'Party Supplies', 'Entertainment', 'Desserts', 'Catering']

Obtaining JSON data in React Native without prior knowledge of the key

Answer №1

Answer №2

Similar questions

Convert a DateTime object to JSON using the Mongo C# driver's toJson

validation using ajax and php

Unexpected issue encountered during the Angular 9 compilation process

Transforming the inputted URL into a clickable hyperlink

Tips on creating a View with flexbox in a React Native component

Challenges with creating an increment and decrement form component using Vue

Encounter a Socket.io connection error due to net::ERR_CONNECTION_REFUSED when trying to access from multiple devices

Transferring data between unrelated components

Tips for displaying consecutive information from a Sequelize query with associations in Node.js

How can I place a DOM element without relying on style properties?

Issue with Angular 5 - Deselect all checkboxes not reflecting in the UI

How can one efficiently modify data structures stored within Firebase?

Can you guide me on how to record a value in Pulumi?

Loading a series of images in advance using jQuery

What are the reasons for the success function not being called and what steps can be taken to correct it

Access and interpret the data stored within a JSON file

Simulating service calls in Jest Tests for StencilJs

Take command of the asynchronous loop

Altering the href text within a script causes the text to disappear instead of updating

Passing data between screens in React Native can sometimes result in a TypeError where a function is not recognized. This error occurs when attempting to access an undefined variable while trying to pass data from one screen to another