2016-06-29 8 views
0

Problem: Ich kann nur eine Iteration meines Arrays rendern.Wie wird ein verschachteltes Array in React.js gemappt?

Mein gewünschtes Ergebnis ist natürlich, die gesamte Länge der Array-Objekte zu erhalten.

Das Hinzufügen von [Schlüssel] zu meinen gerenderten Objektfeldern ist die einzige Methode, die mir irgendeine Ausgabe gibt. Ohne den Schlüssel auf diese Weise erklärt, bekomme ich nichts

Kinder Komponente

... 
const Potatoes = ({potatoes}) => { 
    const PotatoItems = potatoes.map((potato, key) => { 
    if ([potato] == ''){ 
     return false 
    } else { 
    return (
     <li key={key}> 
     <span>{potato[key].name}</span> 
     <span>{potato[key].flavor}</span> 
     </li>); 
    } 
    }); 
    return (
    <div> 
     <ul> 
     {PotatoItems} 
     </ul> 
    </div> 
); 
}; 

geordnete Komponente

... 
render() { 
    const potatoes = new Array(this.props.potatoes); 

    return (
     <section style={divStyle}> 
     <Potatoes potatoes={potatoes} /> 
     </section> 
    ) 
} 

Antwort

0

einfach entfernen new Array() aus um die Kartoffeln konstant Korrekturen dein Problem.

Es scheint, als hätten Sie ein unnötiges zusätzliches Array erstellt.

Dann können Sie diese [Schlüssel] Referenzen auf Ihr Objekt in der Kindkomponente entfernen und Sie sollten gut gehen!

Behebt dies Ihr Problem?

Verwandte Themen