夺命雷公狗-----React---16--事件操作事件

<!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;} </style>
</head>
<body>
<div id="dome"></div>
<div id="test"></div>
<script type="text/babel">
var Fix = React.createClass({
getInitialState:function(){
return{
islink:true
};
},
handleClick:function(){
//alert('这么听话啊');
this.setState({
islink:!this.state.islink
});
},
handleMouseOver:function(){
alert('喂你想干嘛?');
},
handleMouseOut:function(){
alert('吓得我一身冷汗');
},
render:function(){
return(
<div>
<h1>test</h1>
<img src="./images/jj.png" onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut} /> <br /><br />
<p>大家喜欢和他叫朋友吗?<b>{this.state.islink?'喜欢':'不喜欢'}</b></p>
<button onClick={this.handleClick}>有种你就点我</button>
</div>
);
}
});
ReactDOM.render(
<Fix />,
document.getElementById('dome')
);
</script>
</body>
</html>
夺命雷公狗-----React---16--事件操作事件的更多相关文章
- 夺命雷公狗—angularjs—18—angularjs的事件
对于一款前端框架,提起事件,很容易让人联想到DOM事件,比如说鼠标点击以及页面滚动等.但是我们这里说的angular中的事件和DOM事件并不是一个东西. 事件的发布 我们可以通过 $emit() 以及 ...
- 夺命雷公狗—angularjs—16—angularjs里面的缓存
强大的angularjs也给我们预留了一套他的缓存机智,这样在某个程度上来说还是可以做到减轻一点服务器压力的.... <!DOCTYPE html> <html lang=" ...
- 夺命雷公狗-----React---12--添加类和样式
<!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...
- 夺命雷公狗-----React---11--添加css样式的方法
<!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...
- 夺命雷公狗---微信开发17----自定义菜单的事件推送,响应菜单的CLICK
废话不多说,index.php 代码如下所示: <?php /** * wechat php test */ //define your token require_once "com ...
- 夺命雷公狗---DEDECMS----31dedecms数据库创建一张表完成curl操作
首先我们创建一张测试表,格式如下所示: 然后我们还是在plus目录下创建一个test3.php进行测试,首先写一个添加的: <?php header("Content-Type:tex ...
- 夺命雷公狗---微信开发59----在线点播电影网1之ckplayer播放器
我们节课程就要开始写一个小项目了,这项目主要是写一个在线点播电影影网的,我们用到的播放器是ckplayer ckplayer基本介绍: ckplayer的全称是:超酷flv播放器,他是一款用于网页上播 ...
- 夺命雷公狗-----React---10--组建嵌套进行数据遍历
先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...
- 夺命雷公狗-----React---9--map数据的遍历
比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...
- 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定
首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
随机推荐
- 什么是BFC?(转载)
在解释 BFC 是什么之前,需要先介绍 Box.Formatting Context的概念. Box: CSS布局的基本单位 Box 是 CSS 布局的对象和基本单位, 直观点来说,就是一个页面是由很 ...
- event
当一个事件被调用后,它会收到一个参数,第一个参数就是事件对象,事件对象包含type, target, timestamp三个. 类型:事件的名称,例如:点击目标:事件的目标元素时间戳:事件触发的时间
- Python标准异常topic
Python标准异常topic AssertionError 断言语句 (assert) ...
- MySQL索引简述
文章归属:http://feiyan.info/16.html,我想自己总结,但是发现此君总结的非常详细.直接搬过来了 关于MySQL索引的好处,如果正确合理设计并且使用索引的MySQL是一辆兰博基尼 ...
- Android-Sqlite数据库的操作
Sqlite数据库的简单操作: 设置增删改查的按钮,xml界面布局设置 <?xml version="1.0" encoding="utf-8"?> ...
- java命令行引入jar包
编译: E:/>javac -cp e:/jdom.jar test1.java 执行: E:/>java -classpath e:/jdom.jar; test1
- 百钱买百鸡问题 php版本
/* * 百钱买百鸡问题 * * 我国古代数学家张丘建在<算经>一书中曾提出过著名的“百钱买百鸡”问题,该问题叙述如下:鸡翁一,值钱五:鸡母一,值钱三:鸡雏三,值钱一:百钱买百鸡,则翁.母 ...
- mysql慢查询日志分析工具mysqldumpslow
一.mysqldumpslow为mysql自带,安装后既带有该工具. 二.mysqldumpslow经常使用的参数 -s,是order的顺序 al 平均锁定时间 ar 平均返回记录时间 at 平均查询 ...
- opengl中对glOrtho()函数的理解
glOrtho是创建一个正交平行的视景体. 一般用于物体不会因为离屏幕的远近而产生大小的变换的情况.比如,常用的工程中的制图等.需要比较精确的显示. 而作为它的对立情况, glFrustum则产生一个 ...
- 一步一步来做WebQQ机器人-(五)(发送消息||完结)
× 本篇主要是: 发送QQ消息(to:好友,群),以及对小黄鸡抓包利用它的语言库 本文是WebQQ流程的最后一章 最后一章内容不多但我还是啰嗦,可能对大部分人都已知晓的流程方法我也会介绍一下 前面几个 ...