Question

以下代码无效。 onClick事件永远不会被触发但我在browserify或console中看不到任何错误。

var React = require('react');

var Button = React.createClass({
  render: function() {
    return (
      <div className="Button">
        <span className="left" onclick={function() {alert("left")}}>Left</span>
        <span className="right" onclick={function() {alert("right")}}>Right</span>
        <span className="middle" onclick={function() {alert("middle")}}>Middle</span>
      </div>
    );
  }
});

module.exports=Button;

我使用alert来测试小CSS

Answer 1

你的例子中有一个拼写错误。使用＆＃39; onClick＆＃39;而不是＆＃39; onclick＆＃39;。

<span className="left" onClick={function() {alert("left")}}>Left</span>

请参阅jsfiddle了解工作示例 - https://jsfiddle.net/Ltdc8qpr/1/

Answer 2

此处使用箭头函数语法，使用onClick处理程序触发事件。

<span className="left" onClick={() => {alert("left")}}>Left</span>

Answer 3

我遇到了同样的问题。问题是 <span> 标签位于左上角，只有当我点击左上角时才会触发警报。没有任何其他空间。

我将 <span> 更改为 <div> 并且它起作用了。

反应onClick不开火

3 个答案: