我正在嘗試呼叫 API 并在反應 js 中顯示表上的資料。API 結構如下:
"items" : [ {
"@id" : "http://ABCD......" ,
"dateTime" : "2022-05-28T00:00:00Z" ,
"measure" : "http://measurement_1/abc" ,
"value" : 0.066
}
, {
"@id" : "http://ABCD......" ,
"dateTime" : "2022-05-28T00:15:00Z" ,
"measure" : "http://measurement_2/abc" ,
"value" : 0.066
}
, {
"@id" : "http://ABCD......" ,
"dateTime" : "2022-05-28T00:45:00Z" ,
"measure" : "http://measurement_3/abc" ,
"value" : 0.066
}
]
我能夠使用以下代碼顯示 3 列 'dateTime'、'measure'、'value'。
class App extends React.Component{
state ={
items:[]
};
async componentDidMount(){
const response = await fetch('/L1931/readings?today');
const body = await response.json();
this.setState({items:body.items});
}
render(){
const {items} = this.state;
const itemList = items.map(item => {
return <tr key={item.dateTime}>
<td style={{whiteSpace: 'nowrap'}}>{item.dateTime}</td>
<td>{item.value}</td>
<td>{item.measure}</td>
</tr>
});
return (
<div>
<Table className="mt-4">
<thead>
<tr>
<th width="30%">Date</th>
<th width="30%">Value</th>
<th width="40%">Measurement</th>
</tr>
</thead>
<tbody>
{itemList}
</tbody>
</Table>
</div>
);
}
}
輸出就像

現在,我想呼叫“Measurement”列下的子 API 并在表格中顯示某個列。任何人都可以幫助我實作這一目標嗎?
uj5u.com熱心網友回復:
您可以將
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/484456.html
下一篇:RESTGETAPI資料庫市場
