Fehler in reagieren, wenn semantische UI-Tabelle verwenden

Question

Ich benutze semantische UI, um eine Tabelle zu erstellen. Ich möchte die Eigenschaft der Tabellenzeile auf positive setzen. dies wie:

<Table.Row positive> 

hier ist mein Code:

<Table.Row {this.props.email.success ? "positive" : "negative"}> 

aber dieser Fehler occure:

./src/components/EmailItem.js 
Syntax error: ... src/components/EmailItem.js: Unexpected token, expected ... (7:18) 

    5 | render() { 
    6 |  return (
> 7 |  <Table.Row {this.props.email.success ? "positive" : "negative"}> 
    |     ^
    8 |   <Table.Cell> 
    9 |   {this.props.email.from} 
    10 |   </Table.Cell> 

wie kann ich dieses Problem beheben?

Answer 1

Sie sollten etwas davon haben:

var rowProps = {}; 

if (this.props.email.success) { 
    rowProps.positive = 'positive'; 
} else { 
    rowProps.negative = 'negative' 
}; 

    <Table.Row {...rowProps}> 

Answer 2

bereits.

<Table.Row positive={!!this.props.email.success} negative={!this.props.email.success}> 

Und überprüfen Sie diese - How to conditionally add attributes to React components?