(Reagieren) Aussage in foreach-Schleife in JSX

Question

So habe ich die folgenden:

// Build the component HTML. 
return (
    <dl className={ classes }> 

    {items.map((item, index) => 
     { item.type === 'dd' ? 
     <dd key={ index } index={ index }>{ item.text }</dd> 
     : 
     <dt className="search-result__description-list__description" key={ index } index={ index }>{ item.text }</dt> 
     } 
    )} 

    </dl> 
); 

Das Problem: nichts zu machen. Die Daten sind in items vorhanden. Wenn ich den Inhalt einfach ohne die if-else-Anweisung protokolliere, gibt er auch meine Daten zurück. Wenn ich jedoch die if-else-Anweisung verwende, wird nichts angezeigt. Keine Fehler Ether.

Irgendwelche Gedanken?

Answer 1

Sie haben vergessen Rückkehr Aussage

// Build the component HTML. 
return (
    <dl className={ classes }> 

    {items.map((item, index) => 
     { return item.type === 'dd' ? 
     <dd key={ index } index={ index }>{ item.text }</dd> 
     : 
     <dt className="search-result__description-list__description" key={ index } index={ index }>{ item.text }</dt> 
     } 
    )} 

    </dl> 
); 

Sie diese Geige mit der gleichen Logik sehen: https://jsfiddle.net/69z2wepo/94452/

Answer 2

Das Problem in Pfeil Funktion ist, wenn der Block-Syntax ({}s nach dem Pfeil), müssen Sie den zurückgegebenen Wert mit dem Schlüsselwort return angeben.