If I have this JSON:
{
'name': 'Active user',
'config': {
'status': 'active',
}
},
{
'name': 'Paused user',
'config': {
'status': 'active',
}
}
Then I can render a React component and access the data easily:
render: function() {
var panels = [];
this.props.accounts.forEach(function(account) {
panels.push(
<Tabs.Panel title={account.name}>
<h2>{account.name}</h2>
</Tabs.Panel>
);
});
return (<Tabs>{panels}</Tabs>);
}
...
React.render(<Tabs accounts={ACCOUNTS} />, document.body);
If my JSON is structured as below instead, how should I re-factor the render
function to work as I want?
{
'Active User': {
'config': {
'status': 'active',
}
},
'Paused User': {
'config': {
'status': 'paused',
}
}
}
i.e. I no longer have a name
attribute to display.
Is this what you want?
var users = {
'Active User': {
'config': {
'status': 'active',
}
},
'Paused User': {
'config': {
'status': 'paused',
}
}
};
var usersWithName = Object.keys(users).map(function(key) {
var user = users[key];
user.name = key;
return user;
});
Where usersWithName
= [{"config":{"status":"active"},"name":"Active User"},{"config":{"status":"paused"},"name":"Paused User"}]
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With