如何在一個react .map語句中返回數據？

我想在我的return語句中使用warningItem以將某些數據映射到反應組件。如何在一個react .map語句中返回數據？

我想遍歷area但語法有問題。

createWarnings = warningsRawData => { 
    return warningsRawData.map(warningItem => { 
     return (
      <div> 
       <p className={styles.warningMainText} /> 
       <p>warningItem.area[0]</p> 
      </div> 
     ); 
    }); 
};

來源

2017-04-06 Spacemoose

假設'styles'被定義在某處，這似乎很好。也許'warningItem'沒有你認爲它的結構？ –

@FelixKling nope。我可以通過warningItem.area [0]在第二次返回之前到達我的數據。在回報裏面......什麼都沒有。 – Spacemoose

你是什麼意思，「雖然沒有達到那裏」？ – elevine

它看起來像你缺少它周圍的括號。嘗試：

createWarnings = warningsRawData => { 
    return warningsRawData.map((warningItem, i) => { 
     return (
      <div key={i}> 
       <p className={styles.warningMainText} /> 
       <p>{warningItem.area[0]}</p> 
      </div> 
     ); 
    }); 
};

來源

2017-04-06 19:47:55 elevine

如果'warningItem.area [0]'字面上打印在頁面上，那麼應該很明顯。 –

這個工程。我有一些錯誤，但我是一個很好的補充。日Thnx！ – Spacemoose

@Spacemoose歡迎:)我編輯Elevine的答案補充說，所以它不會有一個關鍵丟失的警告:) –

每當你循環返回elememnt的反應，加key屬性是必須的。否則您會收到警告。並且添加{warningItem.area[0]}

createWarnings = warningsRawData => { 
    let values = warningsRawData.map((warningItem,index) => { 
     return (
      <div key={index}> 
       <p className={styles.warningMainText} /> 
       <p>{warningItem.area[0]}</p> 
      </div> 
     ); 
    }); 
    return values 
}

;

來源

2017-04-06 19:48:58 Ved

你改變了什麼，爲什麼？ –

我添加了key = {index}。否則會引發交戰。 – Ved

而你認爲是因爲警告元素沒有呈現？或者爲什麼這會解決OP的問題？ –

如何在一個react .map語句中返回數據？

回答

相關問題