React Native - ListView, CloneWithRow with object not array

Question

I am pulling some data from a webservice. On the calls that are returning JSON arrays i am able to do the following just fine.

 WebServiceHandler.get('http:/api.local/stock',{},{)
         .then((val)=>{
           this.setState({
             dataSource: this.state.dataSource.cloneWithRows(val)
           })
         })
         .catch((error) => console.log('callapi:'+ JSON.stringify(error)));
  }

For instance the following data would work perfectly..

[
    "SKU1",
    "SKU2",
    "SKU3"
]

However when i try to feed object with keys like below it doesn't like it.

{
    "SKU1": {"level":11, "description":"This is SKU 1"},
    "SKU2": {"level":22, "description":"This is SKU 2"},
    "SKU3": {"level":33, "description":"This is SKU 3"}
}

Can ListView handle object with keys or do i need to loop and amend this data on receipt before I can pass it to ListView?

If i have to amend it, without looping it, does any framework offer a quick way to achieve this?

You can convert the object to an array with the key included in the item using spread operator. Something like that functionObject.keys(response).map((key) => ({key, ...response[key]})) — cubbuk
– cubbuk, Commented Nov 3, 2016 at 8:27

Ayberk Anıl Atsız · Accepted Answer · 2016-11-03 08:19:52Z

6

You can not give object to cloneWithRows. you can convert to array or you can use cloneWithRowsAndSections. It accepts object and you can render sectionHeader aswell.

Check documentation -> https://facebook.github.io/react-native/docs/listviewdatasource.html

answered Nov 3, 2016 at 8:19

Ayberk Anıl Atsız

7736 silver badges7 bronze badges

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

1 Comment

Matt The Ninja Over a year ago

Perfect, just what i was looking for, just using the section so i can access the properties rather than pushing them all out. Works a treat!

Collectives™ on Stack Overflow

React Native - ListView, CloneWithRow with object not array

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related