I am receiving data from an external api in React
I have an object
lend_rates = {
bitfinex : 1.2,
blockfi : 2.3,
celsius : 3,
coinlist : 1.5
}
I am trying to map through it so i can render the data i.e it shows on the screen "bitfinex : 1.2, blockfi : 2.3, etc"
metrics.lend_rates.map((rate, i)=>{
return(
<div key={i}>
{rate.key} : {rate.value}
</div>
)
})
but im gettin an error saying its not a function.
What am i doing wrong?
I guess there's no .map function on Objects.
Try with Object.entries, which returns a mappable array, instead:
Object.entries(lend_rates).map(([ key, value ], i) =>
<div key={i}>
{key} : {value}
</div>
)
const lend_rates = {
bitfinex : 1.2,
blockfi : 2.3,
celsius : 3,
coinlist : 1.5
}
const lend_rates_arr = Object.keys(lend_rates);
const newArr = lend_rates_arr.map((rate, idx) => {
return { label: [rate], value: Object.values(lend_rates)[idx] }
})
console.log(newArr);
newArr.map(item => console.log(item.label))