Matt The Ninja Matt The Ninja - 1 month ago 8
React JSX Question

React Native - ListView, CloneWithRow with object not array

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?

Answer

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

Comments