有沒有辦法可以輕松地將行陣列映射到 reactjs/javascript 中的表?我的資料如下所示:
rows: [
['10kg', '12.5', '1.25', '8'],
['25kg', '28.75', '1.15', '6'],
['50kg', '50', '1.0', '5'],
['100kg', '100', '1.0', '3'],
['250kg', '250', '1.0', '5'],
['500kg', '500', '1.0', '5'],
['1liter', '1000', '1.0', '5']
]
"labels": [
"Weight",
"Price",
"Price Per",
"Amount"
],
在python中有一些表,我可以在其中設定列然后遍歷陣列并通過陣列項添加行。javascript/reactjs 有沒有類似的東西?
uj5u.com熱心網友回復:
將資料作為串列更改為物件:
let rows = [['10kg', '12.5', '1.25', '8'],
['25kg', '28.75', '1.15', '6'],
['50kg', '50', '1.0', '5'],
['100kg', '100', '1.0', '3'],
['250kg', '250', '1.0', '5'],
['500kg', '500', '1.0', '5'],
['1liter', '1000', '1.0', '5']];
let labels = ["Weight","Price","Price Per","Amount"];
let values = rows.map(row => {
let d = {};
row.forEach((c, i) => d[labels[i]] = c);
return d;
});
console.log(values)
let columns = labels.map(l => ({field: l, width: 150}));
console.log(columns);
然后用一個渲染 DataGrid
return <DataGrid rows={values} columns={columns}/>
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/395217.html
標籤:javascript Python 数组 反应
