React - 如何在三元运算符中包含动态变量

Question

在JSX中，如何使用三元运算符包含动态变量？下面的JSX会给出意想不到的令牌错误，但是如果我用文字代替R，它会起作用。

let cardIDs = this.props.cards.map(x => <li key={x.title}> 
{this.state.showName ? {x.title} : "S"} 
</li>); 

Answer 1

删除{}

{ this.state.showName ? x.title : "S" } 
         ^^  ^^