我想有条件地显示和隐藏此按钮组,具体取决于从父组件传入的内容,如下所示:
<TopicNav showBulkActions={this.__hasMultipleSelected} />
Run Code Online (Sandbox Code Playgroud)
....
__hasMultipleSelected: function() {
return false; //return true or false depending on data
}
Run Code Online (Sandbox Code Playgroud)
....
var TopicNav = React.createClass({
render: function() {
return (
<div className="row">
<div className="col-lg-6">
<div className="btn-group pull-right {this.props.showBulkActions ? 'show' : 'hidden'}">
<button type="button" className="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
Bulk Actions <span className="caret"></span>
</button>
<ul className="dropdown-menu" role="menu">
<li><a href="#">Merge into New Session</a></li>
<li><a href="#">Add to Existing Session</a></li>
<li className="divider"></li>
<li><a href="#">Delete</a></li>
</ul>
</div>
</div>
</div>
);
}
});
Run Code Online (Sandbox Code Playgroud)
然而,{this.props.showBulkActions?没有发生任何事情?'show':'hidden'}.我在这里做错了吗?
我需要在常规类列表中添加动态类,但不知道如何(我正在使用babel),如下所示:
<div className="wrapper searchDiv {this.state.something}">
...
</div>
Run Code Online (Sandbox Code Playgroud)
有任何想法吗?
谢谢
我现在正在做一些React,我想知道是否有一种"正确"的方式来做条件样式.在他们使用的教程中
style={{
textDecoration: completed ? 'line-through' : 'none'
}}
Run Code Online (Sandbox Code Playgroud)
我不想使用内联样式,所以我想改为使用类来控制条件样式.如何以React的思维方式解决这个问题?或者我应该使用这种内联样式方式?