react的onClick和onclick

来源:2-5 设计复合式控件(1)

慕村9558406

2018-04-30 17:34

onClick 等事件,与原生 HTML 不同,on 之后第一个字母是大写的!,如果将 onClick={this.handleClick} 换成 onclick={this.handleClick} 则点击事件不再生效。

  <div id="example"></div>

    <script type="text/babel">

      var LikeButton = React.createClass({

        getInitialState: function() {

          return {liked: false};

        },

        handleClick: function(event) {

          this.setState({liked: !this.state.liked});

        },

        render: function() {

          var text = this.state.liked ? '喜欢' : '不喜欢';

          return (

            <p onClick={this.handleClick}>

              你<b>{text}</b>我。点我切换状态。

            </p>

          );

        }

      });


      ReactDOM.render(

        <LikeButton />,

        document.getElementById('example')

      );


写回答 关注

1回答

  • 测试的自编自导自演
    2018-05-01 20:39:42

    因为这是React识别回调函数的写法,onclick是html识别。。。。环境不一样 -  -

React组件

带你了解如何创建好拥有各自状态的组件,再由组件构成更加复杂的界面

26078 学习 · 27 问题

查看课程

相似问题