2017-10-13 1 views
0

Kann ich in einem Container mehrere Objekte rendern? Zum Beispiel habe ich ArrayArray-Render-Objekte von mehreren Elementen, nicht nur eine

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 
array.map((item, index) => (
<div> 
<div> item 1, 2, 3 </div> 
<div> item 4, 5, 6 </div> 
<div> item 7, 8, 9 </div> 
</div 
) 
+0

Ja. Das kannst du machen. –

+0

Wie sollte Ihre erwartete Ausgabe aussehen? –

+0

Sie können dies tun, müssen Sie nur zu Unterkomponenten zerlegen und Sie "Master-Komponente" mit ihnen zusammenbauen. – sjahan

Antwort

0

Sie array#slice Array aufteilen können dann array#map verwenden einen Chunk zu einem Zeitpunkt angezeigt werden soll.

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 
 

 
var Div =() => { 
 
    return(
 
    <div> 
 
    {array 
 
    .map((item, index, array) => 
 
     index % 3 === 0 ? array.slice(index, index+3) : null) 
 
    .filter(x => x) 
 
    .map((item, index) => (<div>item {item.join(', ')}</div>))} 
 
    </div> 
 
); 
 
}; 
 

 
ReactDOM.render(<Div />,document.getElementById('container'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id='container'></div>

Verwandte Themen