夺命雷公狗-----React---15--三元运算符
2016-11-18 17:57
495 查看
<!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('这么听话啊'); }, 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---3--标签的规则
- 夺命雷公狗-----React---22--小案例之react经典案例todos(完成数据的遍历)
- 夺命雷公狗-----React---26--小案例之react经典案例todos(统计部分的完成)
- 夺命雷公狗-----React_native---4---初始化项目
- 夺命雷公狗-----React---23--小案例之react经典案例todos(完成添加任务)
- 夺命雷公狗---DEDECMS----15dedecms首页栏目列表页导航部分完成
- 夺命雷公狗-----React---4--props变量的传递
- 夺命雷公狗-----React---14--移入移出事件
- 夺命雷公狗-----React---12--添加类和样式
- 夺命雷公狗-----React---28--小案例之react经典案例todos(全选和反选)完
- 夺命雷公狗-----React---6--props多属性的传递
- 夺命雷公狗-----React---16--事件操作事件
- 夺命雷公狗---微信开发15----编写进行创建自定义菜单
- 夺命雷公狗-----React---13--事件监听
- 夺命雷公狗---javascript NO:15 事件冒泡3
- 夺命雷公狗-----React_native---1---jdk的安装
- 夺命雷公狗-----React_native---2---sdk的安装
- 夺命雷公狗-----React---17--事件常用的属性
- 夺命雷公狗-----React---9--map数据的遍历
- 夺命雷公狗-----React---24--小案例之react经典案例todos(单条任务的删除)