for-in 루프 및지도에 반응하십시오.

Question

반응하는 앱을 개발 중입니다. 문제가 발생할 수 있으므로 누구나 도움을 주시면 감사하겠습니다.

데이터를 날짜별로 그룹화하고 있으며 데이터 형식이 {dd/mm/yyyy:[data,data], dd/mm/yyyy:[data,data]} 인 개체가 있습니다.

그래서 루프를 객체와지도를 반복하여 배열을 통해 반복 한 다음 렌더링합니다. 그러나 첫 번째 키 - 값 쌍에서 렌더링을 중지하는 것처럼 보입니다. 왜냐하면지도 앞에있는 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> 
       ) 

      }) 
     }