夺命雷公狗-----React---13--事件监听
2016-11-17 17:08
323 查看
在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---14--移入移出事件
- 夺命雷公狗-----React---16--事件操作事件
- 夺命雷公狗-----React---17--事件常用的属性
- React 事件 监听
- 夺命雷公狗-----React---26--小案例之react经典案例todos(统计部分的完成)
- 夺命雷公狗-----React_native---3---react-native-cli的安装
- JavaScript基础_13事件绑定函数+监听函数+冒泡事件流
- 夺命雷公狗jquery---21-bind为jquery对象绑定相关事件
- 4、React对组件的DOM事件监听
- react 监听 移动端 手机键盘 enter 事件
- 夺命雷公狗---node.js---13之Buffer的转换
- 夺命雷公狗-----React---12--添加类和样式
- react-native监听Android(Android向RN发送事件)
- ReactJS 监听页面滚动事件
- 夺命雷公狗-----React---15--三元运算符
- 夺命雷公狗jquery---24事件移除unbind
- 夺命雷公狗---javascript NO:11 事件对象1
- 夺命雷公狗-----React---22--小案例之react经典案例todos(完成数据的遍历)
- 夺命雷公狗-----React_native---1---jdk的安装
- 夺命雷公狗---Thinkphp----13之前台的头尾分离和导航分离