渲染以下組件回傳
物件作為 React 子物件無效
import moment from "moment";
const PayrollRuns = (props) => {
const runItems = props.payrollRuns.map((run) =>
<div key={run.id} className="flex justify-between p-2 text-lg">
<div>
{moment(run.month.period).format('YYYY MMMM')}:
Paid {run.payroll_run_items.length} talents
</div>
<div>
{run.payroll_run_items.reduce((acc, value) => {
return value.amount;
})}
</div>
</div>
);
return (
<div className="runs-wrapper bg-white rounded-xl h-full w-48 shadow-sx-shadow p-4 flex flex-col">
<h1 className="border-b-2 pb-4">Payroll Runs</h1>
<div className="grow overflow-auto p-4">{runItems}</div>
</div>
)
}
export default PayrollRuns
我可以將問題深入到這一部分:
<div>
{run.payroll_run_items.reduce((acc, value) => {
return value.amount;
})}
</div>
那么錯誤是否意味著reduce方法回傳一個物件而不是單個值?如果是,如何解決這個問題?如果不是,還有什么問題?
uj5u.com熱心網友回復:
看起來您正試圖通過從payroll_run_items
陣列中添加它來獲取單個值。
您沒有為累加器指定起始值,也沒有在value.amount
任何地方收集。
這是一個實作您想要的簡單示例:
const payroll_run_items = [{
amount: 34,
// Other properties
}, {
amount: 35,
// Other properties
}]
console.log(payroll_run_items.reduce((acc, value) => {
return value.amount acc; // Add 'value.amount' to 'acc'
}, 0)) // Specify a start value
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/468495.html
標籤:javascript 反应
上一篇:異步查找最高數