React 中的条件样式

【问题标题】：conditional styling in ReactReact 中的条件样式
【发布时间】：2019-04-25 09:17:26
【问题描述】：

在 React 中我可以做这样的事情吗：

style={ $post.type === "team_member" ? backgroundColor : "green"}

如何根据 React 中的条件设置样式？

提前谢谢你！

【问题讨论】：

【解决方案1】：

你可以，而且已经接近你已经拥有的；

style={{backgroundColor: $post.type === "team_member" ? 'green': 'not_a_team_member'}}

style 属性需要一个对象，因此双 {}，您只是有条件地分配 backgroundColor 的值，因此条件是对象中键 backgroundColor 的值。

希望这会有所帮助！

【讨论】：

【解决方案2】：

你可以这样做：

<div style={{ visibility: this.state.post.type === 'team_member'? 'green': ''}}></div>

【讨论】：

【解决方案3】：

你可以这样做：

<div style={ post.type === "team_member" ? {backgroundColor : "green" }: '' }}></div>

【讨论】：