<!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{

                        user:''

                    }

                },

                handleChange:function(e){

                    this.setState({

                        user:e.target.value.toUpperCase()

                    })

                },

                render:function(){

                    return(

                        <div>

    验证码：<input type="text" name="user" value={this.state.user} onChange={this.handleChange} />1f5Q

                        </div>

                    );

                }

            });

            ReactDOM.render(

                <Fix />,

                document.getElementById('dome')

            );

        </script>

    </body>

</html>

夺命雷公狗-----React---20--实现验证码大写的更多相关文章

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

  2. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  3. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  4. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  5. 夺命雷公狗-----React---7--组建的状态props和state

    props:组建初始要渲染的数据,他是不可以改变的 state:组建状态发生改变,调用render重新渲染数据 我们来写一个例子: <!DOCTYPE html> <html lan ...

  6. 夺命雷公狗-----React---6--props多属性的传递

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

  7. 夺命雷公狗-----React---5--props对象的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  8. 夺命雷公狗-----React---4--props变量的传递

    提示:props的值是不可以改变的... <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 夺命雷公狗-----React---3--标签的规则

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

  10. 夺命雷公狗-----React---2--组建

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

随机推荐

  1. .NET简谈接口

    自从面向对象开发方式的出现,抽象的概念就开始日新月异的发展,面向对象编程.面向接口编程.面向组件编程等等:这一系列的概念都是软件工程所追求的思想范畴,高类聚低耦合. 今天我要简谈的是面向对象里面非常重 ...

  2. python 安装nltk，使用（英文分词处理，词干化等）（Green VPN）

    安装pip命令之后: sudo pip install -U pyyaml nltk import nltk nltk.download() 等待ing 目前访问不了,故使用Green VPN htt ...

  3. 【手把手教你Maven】构建过程

    Maven是一款进行 依赖管理.项目构建.信息管理 为一体的工具. 它不像Make具有复杂的命令.也不像Ant需要手动编写大量的重复代码就能进行项目的构建: 还能提供强大的依赖库管理,避免jar包混乱 ...

  4. jmeter jar包

    jmeter jar包下载地址: http://cn.jarfire.org/ApacheJMeter.html 放在 jmeter /lib目录下

  5. NC57,NC63-NC二开经验总结

    版主2010级市场营销专业本科生 2013年8月入达内培训Java相关技术 12月入职,做用友NC的二次开发工作 2015年4月离职,4中下旬入职一家互联网金融企业 下面是做NC二开期间积累的一些常用 ...

  6. SYMMETRIC MULTIPROCESSORS

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION As demands for perfor ...

  7. [dpdk] 熟悉SDK与初步使用 （四）(L3 Forwarding源码分析)

    接续前节:[dpdk] 熟悉SDK与初步使用 (三)(IP Fragmentation源码分析) 前文中的最后一个问题,搁置,并没有找到答案.所以继续阅读其他例子的代码,想必定能在其他位置看到答案. ...

  8. Oracle知识分类之常见规范

    命名规范 变量规范 1.入参,统一以I_前缀开头,且不能省略IN 2.出参,统一以O_前缀开头 3.局部变量,统一以V_前缀开头 4.常量,统一以CN_前缀开头 5.游标,统一以CUR_前缀开头 组成 ...

  9. javascript中原型（prototype）与原型链

    javascript是一门动态语言(动态语言Dynamic Programming Language:动态类型语言,意思就是类型的检查是在运行时做的,也就是常说的“弱类型”语言),没有类的概念,有cl ...

  10. redis学习教程地址

    http://www.yiibai.com/redis/redis_quick_guide.html