Class 动态子 React 的名称
Class names for dynamic children React
我有一组从数组创建的按钮,但是我不确定如何为它们设置单独的类名。有简单的方法吗?
var ButtonContainer = React.createClass({
render: function(){
var answerList = this.props.answerList.map(function(input, i){
return <SingleButton key={'button'+i} singleAnswer={input}/>
}.bind(this));
return <div> {answerList} </div>
}
})
var SingleButton = React.createClass({
render: function(){
return (
<div>
<button className='quiz-button'>{this.props.singleAnswer}</button>
</div>
)
}
});
我试过 className={this.props.key} 但这似乎不起作用。感谢您的帮助!
从 React v0.12 开始 key
and ref
are removed from props
:
You can no longer access this.props.ref and this.props.key from inside
the Component instance itself. So you need to use a different name for
those props.
这就是设置 className={this.props.key}
不起作用的原因。但你可以试试这个:
return <SingleButton key={'button'+i} className={'button'+i} singleAnswer={input}/>
然后
<button className={this.props.className}>{this.props.singleAnswer}</button>
相关问题:This.key in React.js 0.12
我有一组从数组创建的按钮,但是我不确定如何为它们设置单独的类名。有简单的方法吗?
var ButtonContainer = React.createClass({
render: function(){
var answerList = this.props.answerList.map(function(input, i){
return <SingleButton key={'button'+i} singleAnswer={input}/>
}.bind(this));
return <div> {answerList} </div>
}
})
var SingleButton = React.createClass({
render: function(){
return (
<div>
<button className='quiz-button'>{this.props.singleAnswer}</button>
</div>
)
}
});
我试过 className={this.props.key} 但这似乎不起作用。感谢您的帮助!
从 React v0.12 开始 key
and ref
are removed from props
:
You can no longer access this.props.ref and this.props.key from inside the Component instance itself. So you need to use a different name for those props.
这就是设置 className={this.props.key}
不起作用的原因。但你可以试试这个:
return <SingleButton key={'button'+i} className={'button'+i} singleAnswer={input}/>
然后
<button className={this.props.className}>{this.props.singleAnswer}</button>
相关问题:This.key in React.js 0.12