我在https://api.exchangerate.host/latest得到了 api ，如果你看到費率，我想從
rates :{"start": 1,...., "end": 20}
進入
rates:[{"start": 1},..,{"end":20}]
原因是我無法使用
rates.map(item=> <li>item.key | item.val</li>);
或使用
render(){
var {isLoaded, items} = this.state;
if(!isLoaded){
return <div>Loading...</div>
}else{
const results = Object.entries(items.rates).map(el => ({"key":[el[0]], "value": el[1]}))
// console.log(results);
return(
<div className="App">
<header className="App-header">
<ul>
{results.map(item => <li key={item["key"]}> {item["key"]} : {item["value"]} </li>)}
</ul>
</header>
</div>
);
}
}
}
uj5u.com熱心網友回復：
使用 Object.entries() 怎么樣，像這樣：
const data = { start: 1, end: 20 }
const res = Object.entries(data).map(el => ({[el[0]]: el[1]}))
console.log(res) // returns [ { start: 1 }, { end: 20 } ]
如果需要，您可以將回傳值字串化為 JSON 格式
console.log(JSON.stringify(res)) // returns [{"start":1},{"end":20}]
uj5u.com熱心網友回復：
如果你想要一個陣列，就像你想要的那樣可以做到
const rates = {"rates": {"start": 1,"end": 20}}
var results = Object.keys(rates.rates).map(el => ({[el]:rates.rates[el]}));
console.log(results)或者，如果您在 jsx 中撰寫它，則可以直接創建這樣的串列項陣列
var listItems = Object.keys(rates.rates).map(el => (<li>{[el]}|{rates.rates[el]}</li>));
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/337027.html
標籤：反应