我正在制作一个非常简单的应用程序,您可以单击方形 div 将其颜色从白色更改为黑色。但是,我遇到了麻烦。我想使用 onClick 函数来允许用户单击正方形来更改其颜色,但它似乎不起作用。我尝试过使用 span 和空 p 标签,但这也不起作用。
这是有问题的代码:
var Box = React.createClass({
getInitialState: function() {
return {
color: 'white'
};
},
changeColor: function() {
var newColor = this.state.color == 'white' ? 'black' : 'white';
this.setState({
color: newColor
});
},
render: function() {
return (
<div>
<div
style = {{background: this.state.color}}
onClick = {this.changeColor}
>
</div>
</div>
);
}
});
这是我在 CodePen 上的小项目的链接。 http://codepen.io/anfperez/pen/RorKge
最佳答案
为了让您放心,onClick
事件确实可以与 React 中的 div 配合使用,因此请仔细检查您的代码语法。
这些是正确的:
<div onClick={doThis}>
<div onClick={() => doThis()}>
这些都是错误的:
<div onClick={doThis()}>
<div onClick={() => doThis}>
(并且不要忘记关闭标签...注意这一点:
<div onClick={doThis}
div 上缺少结束标记)
关于javascript - 如何在 React.js 中使用 onClick 和 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40535444/