React - 如何使用三元运算符包含动态变量

Question

在 JSX 中，如何使用三元运算符包含动态变量？下面的 JSX 给出了意外的标记错误，但是如果我用文字 R 替换 {x.title} 它有效。

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" }
                       ^^     ^^

React - How do I include a dynamic variable with ternary operator