反应 for-in 循环和映射 [重复]

Question

我正在开发一个 react 应用程序，但我遇到了一个问题，所以如果有人可以的话，我非常感谢一些帮助。

我正在按日期对数据进行分组，并且我有一个对象包含这种格式的数据{dd/mm/yyyy:[data,data], dd/mm/yyyy:[data,data]}。

所以我正在执行一个 for in 循环来遍历对象，然后执行一个映射来遍历数组然后渲染这些，但是它似乎在第一个键值对处停止渲染，我假设这是因为地图之前的 return 语句，但如果没有它，渲染函数似乎无法工作。

这是我的代码，非常感谢任何帮助。

谢谢！

  export default class ExpenseMain extends React.Component{

    renderStuff(){
        var expenses = this.props.expenses
        if(Object.keys(expenses).length > 0){
            for(var key in expenses){
                return expenses[key].map((ele,i)=>{
                    return (
                        <div    
                            className = "expensesLoop"
                            key = {i}>
                            <ExpenseItem 
                                expense  = { ele }
                                removeExpense = { this.props.removeExpense }
                                updateExpense = { this.props.updateExpense }
                            />
                            <hr/>
                        </div>
                    )

                })
            }
        }
    }
    render(){
        return <div>{this.renderStuff()} </div>
    }
}

Answer 1

for 不返回任何内容。所以，结果将是undefined。

改用Object.keys().map：

        Object.keys(expenses).map(key => {
            return expenses[key].map((ele,i)=>{
                return (
                    <div    
                        className = "expensesLoop"
                        key = {i}>
                        <ExpenseItem 
                            expense  = { ele }
                            removeExpense = { this.props.removeExpense }
                            updateExpense = { this.props.updateExpense }
                        />
                        <hr/>
                    </div>
                )

            })
        }