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

  1. <!DOCTYPE>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. <script src="./js/react.js"></script>
  7. <script src="./js/react-dom.js"></script>
  8. <script src="./js/browser.min.js"></script>
  9. <style>
  10. *{ margin:0px; padding:0px;}
  11. .lists ul{ list-style:none; clear:both; }
  12. .lists ul li{ clear:; }
  13. .lists ul li img{ width:100px; }
  14. .lists ul li div:nth-child(1),.lists ul li div:nth-child(2),.lists ul li button{ float:left; }
  15. .lists ul li div:nth-child(2),.lists ul li button{ margin-left:30px; }
  16. .lists ul li button{ line-height:80px; height:80px; }
  17. </style>
  18. </head>
  19. <body>
  20. <div id="dome"></div>
  21. <script type="text/babel">
  22. var Fix = React.createClass({
  23. handleClick:function(){
  24. alert('别老是点我');
  25. },
  26. render:function(){
  27. return (
  28. <div>
  29. <h1>事件处理</h1>
  30. <button onClick={this.handleClick}>GO</button>
  31. </div>
  32. );
  33. }
  34. });
  35. ReactDOM.render(
  36. <Fix />,
  37. document.getElementById('dome')
  38. );
  39. </script>
  40. </body>
  41. </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. “Invalid maximum heap size” when running Maven

    运行mvn package,报错: Invalid maximum heap size: -Xmx512m. Error: Could not create the Java Virtual Mach ...

  2. C#进程操作

    C#进程操作 转:http://www.cnblogs.com/vienna/p/3560804.html 一.C#关闭word进程  foreach (System.Diagnostics.Proc ...

  3. hbase的查询scan功能注意点(setStartRow, setStopRow)

    来自http://hi.baidu.com/7636553/blog/item/982beb17713bc004972b43ee.html hbase的scan查询功能注意项: Scan scan = ...

  4. iOS 程序员 6 级考试(答案和解释)

    iOS 程序员 6 级考试(答案和解释)   我是前言 1. 下面的代码分别输出什么? @implementation Son : Father- (id)init { self = [super i ...

  5. 用Maven生成Eclipse中的Web项目

    转自:http://my.oschina.net/u/939893/blog/170185 进入workspace, 输入以下命令 mvn archetype:generate -DgroupId=  ...

  6. hdu 1312

    原题链接 题意:“@”为起点,“.”为路,求可以走的格子有多少个(包括起点) 水题 bfs搜一发 思路:只有可以走的节点才能进入队列,所以每次出队列时ans+1就可以了(没有退出条件,所有可进入的节点 ...

  7. ado.net 完整修改删除,攻击防攻击

    完整修改和删除:当你输入了要删除的用户名,先提示有没有此条数据 先查 后删/后改------------ using System; using System.Collections.Generic; ...

  8. Odoo 8.0 实施开发指南 第一版 试读

    试读地址: http://share.weiyun.com/4f83964db87e022c7c210abe6b5e782f 如有错误,欢迎指正.

  9. sql语句左右表连接理解

    一句话,左连接where只影响坐标,右连接where只影响右表

  10. 一款名為com.apple.pcapd的服務

    一款名為com.apple.pcapd的服務,通過libpcap網路數據包捕獲函數包捕獲流入和流出iOS設備的HTTP數據.據紮德爾斯基稱,這一服務在所有iOS設備上都是默認啟動的,能被用來在用戶不知 ...