Fetch keys and values from API array react native

Question

I'm trying to access both keys and also values in an array of an API

export default const App= () =>{

    const [data, setData] = useState([]);
    console.log(data);

     //Some fetch code here
    //setData happen here
  
    return  (
       <View >
        <Text >fetched data</Text>
          <Text>{data?.data?.a}</Text>
          <Text>{data?.data?.b}</Text>
          <Text>{data?.data?.c}</Text>

        </View>
        )

};

the supposed array is like this

arr = {code: 0, data:{a: 1, b: 2, c: 3}}

but it will only return 1, 2, 3 and I wanted it to be a: 1, b: 2, c: 3

That's not an array. {data.data && Object.entries(data.data).map((key, value) => <Text key={key}>{key}: {value}</Text>)} (also: const [data, setData] = useState({});) reactjs.org/docs/lists-and-keys.html — user5734311
– user5734311, Commented Aug 30, 2022 at 6:03

mplungjan · Accepted Answer · 2022-08-30 06:04:28Z

1

You can access the Object.entries

const arr = {code: 0, data:{a: 1, b: 2, c: 3}}

console.log(`<Text>${Object.entries(arr.data).map(([key,val])=>`${key}:${val}`).join('</Text></Text>')}</Text>`)

answered Aug 30, 2022 at 6:04

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bhavya Koshiya · Accepted Answer · 2022-08-30 08:51:13Z

0

Try this

<View>
    <Text>fetched data</Text>
    {Object.entries(arr?.data).map(([key, val]) => {
        <Text>{`${key}:${val}`}</Text>;
    })}
</View>

answered Aug 30, 2022 at 8:51

Bhavya Koshiya

1,8662 gold badges11 silver badges24 bronze badges

Collectives™ on Stack Overflow

Fetch keys and values from API array react native

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related