使用语义UI表时发生错误

Question

我使用语义UI创建表。 我想将表行属性设置为positive。像这样：

<Table.Row positive> 

这里是我的代码：

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

但这种错误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> 

我怎样才能解决这一问题？

Answer 1

你应该有这样的事情：

var rowProps = {}; 

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

    <Table.Row {...rowProps}> 

Answer 2

试试这个。

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

并检查这一点 - How to conditionally add attributes to React components?