在react中事件监听直接作为组建的属性来添加即可，就像DOM中的html操作

<!DOCTYPE>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <script src="./js/react.js"></script>

        <script src="./js/react-dom.js"></script>

        <script src="./js/browser.min.js"></script>

        <style>

            *{ margin:0px;  padding:0px;}

            .lists ul{ list-style:none; clear:both; }

            .lists ul li{ clear:; }

            .lists ul li img{ width:100px; }

            .lists ul li div:nth-child(1),.lists ul li div:nth-child(2),.lists ul li button{ float:left; }

            .lists ul li div:nth-child(2),.lists ul li button{ margin-left:30px; }

            .lists ul li button{ line-height:80px; height:80px; }

        </style>

    </head>

    <body>

        <div id="dome"></div>

        <script type="text/babel">

            var Fix = React.createClass({

                handleClick:function(){

                    alert('别老是点我');

                },

                render:function(){

                    return (

                        <div>

                            <h1>事件处理</h1>

                            <button onClick={this.handleClick}>GO</button>

                        </div>

                    );

                }

            });

            ReactDOM.render(

                <Fix />,

                document.getElementById('dome')

            );

        </script>

    </body>

</html>

夺命雷公狗-----React---13--事件监听的更多相关文章

  1. 夺命雷公狗—angularjs—20—$watch监听的用法

  2. [技术博客]react native事件监听、与原生通信——实现对通知消息的响应

    在react native中会涉及到很多页面之间的参数传递问题.静态的参数传递通常利用组件的Props属性,在初始化组件时即可从父组件中将参数传递到子组件中.对于非父子关系的组件来说,无法直接传递参数 ...

  3. react入门----事件监听

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 夺命雷公狗—angularjs—13—post参数的接收发送

    我们强悍的angularjs为我们不仅仅提供了他的get接收方式,而且也有post的接收方式,我们现在做一个模拟接收后端传递过来的json的数据: <?php $arr = ['user'=&g ...

  5. React.js 小书 Lesson9 - 事件监听

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson9 转载请注明出处,保留原文链接和作者信息. 在 React.js 里面监听事件是很容易的事情 ...

  6. 夺命雷公狗---微信开发17----自定义菜单的事件推送，响应菜单的CLICK

    废话不多说,index.php 代码如下所示: <?php /** * wechat php test */ //define your token require_once "com ...

  7. react native 之 事件监听 和 回调函数

    同原生一样,react native 同样也有事件监听和回调函数这玩意. 场景很多,比如:A界面push到B界面,B界面再pop回A界面,可以给A界面传值或者告诉A刷新界面. 事件监听 事件监听类似于 ...

  8. React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路

    React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路 这几天在忙着把自己做的项目中的类组件转化为功能相同的函数组件,首先先贴一份该组件类组件的关 ...

  9. 夺命雷公狗—angularjs—18—angularjs的事件

    对于一款前端框架,提起事件,很容易让人联想到DOM事件,比如说鼠标点击以及页面滚动等.但是我们这里说的angular中的事件和DOM事件并不是一个东西. 事件的发布 我们可以通过 $emit() 以及 ...

随机推荐

  1. 可能碰到的iOS笔试面试题（4）--C语言

    可能碰到的iOS笔试面试题(4)--C语言 可能碰到的iOS笔试面试题(4)--C语言 C语言,开发的基础功底,iOS很多高级应用都要和C语言打交道,所以,C语言在iOS开发中的重要性,你懂的.里面的 ...

  2. Android计数器的实现(倒计时)

    安卓实现计数器有四种方式,直接给代码 1.使用Thread+Handler ; private Handler handler1 = new Handler() { @Override public ...

  3. Java.lang.NoSuchFieldError: INSTANCE异常

    解决方案: java.lang.NoSuchFieldError: INSTANCE异常. 1.jar包重复了. 2.版本还不相同,如果包的版本不同也会报相应的错,不过一般情况自己导入的jar包主要看 ...

  4. WordPattern

    Given a pattern and a string str, find if str follows the same pattern. Examples: pattern = "ab ...

  5. .net 服务器端文件下载

    string path = Server.MapPath("/Source/mjpjb.rar"); System.IO.FileInfo file = new System.IO ...

  6. jquery 设置表格奇偶数的颜色和行被选中的颜色样式jquery 设置表格奇偶数的颜色和行被选中的颜色样式

    query 代码 $(funtion(){ //设置偶数行和奇数行 $("tbody>tr:odd").addClass("ou");   //为奇数行设 ...

  7. Final-阶段站立会议1

    组名:天天向上 组长:王森 组员:张政.张金生.林莉.胡丽娜 代码地址:HTTPS:https://git.coding.net/jx8zjs/llk.git SSH:git@git.coding.n ...

  8. 基于php5.6 php.ini详解

    PHP中auto_prepend_file与auto_append_file的用法 第一种方法:在所有页面的顶部与底部都加入require语句.例如:?123require('header.php') ...

  9. jdk安装配置具体分析

    JDK 选择安装目录 安装过程中会出现两次 安装提示 .第一次是安装 jdk ,第二次是安装 jre .建议两个都安装在同一个java文件夹中的不同文件夹中.(不能都安装在java文件夹的根目录下,j ...

  10. asp.net identity 2.2.0 中角色启用和基本使用（五）

    建立控制器UsersAdminController 第一步:在controllers文件夹上点右键>添加>控制器, 我这里选的是“MVC5 控制器-空”,名称设置为:UsersAdminC ...