React JS Drucken von Daten in einer geschachtelten Map-Funktion in JSX

Question

Ich versuche, Daten in einer geschachtelten Map-Funktion zu drucken. Aus irgendeinem Grund wird nichts gedruckt. hier ist, was ich habe:

{dataFormat.protein_questions.map((item, index) => (
     <div key={_.uniqueId()} className="item"> 
     <div className="inline fields"> 
      <Field 
       onChange={handleChange} 
       name={`protein_question[${index}].units_of_measurement`} 
       component="select" 
       className="ui dropdown2" 
       required> 

       {item.typing_methods.map((method, methodIndex) => { 
        method.unitsOfMeasurement.map((unit, unitIndex) => (
         <option value={unit.title}>{unit.title}</option> 
        )); 
       })} 

      </Field> 
     </div> 
     </div> 
))} 

Die Optionen sind keine Daten in der Auswahl aus irgendeinem Grund drucken. Wenn ich die Daten in der Nested-Loop-Konsole protokolliere, zeigt es sich gut. Wer weiß, warum das passiert?

Übrigens ist dies innerhalb meiner Render-Funktion in einer JSX-View-Datei.

Answer 1

Es sieht aus wie Sie return vor method.unitsOfMeasurement... vergessen:

{item.typing_methods.map((method, methodIndex) => { 
    return method.unitsOfMeasurement.map((unit, unitIndex) => (
    <option value={unit.title}>{unit.title}</option> 
)); 
})}