<!DOCTYPE html>
<html>
<head lang="en">
  <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>
</head>
<body>
<div id="example"></div>

<script type="text/babel">

  var FormComponent = React.createClass({
    getInitialState:function(){
      return {result:'123'}
    },
    handleChange:function(event){
      console.log(event.target.value);
      this.setState({result:event.target.value});
    },
    handleSubmit:function(event){
      event.preventDefault();
      console.log(this.state.result);
    },
    render:function(){
      return <form onSubmit={this.handleSubmit}>
      <input type="text"
            onChange={this.handleChange}
            value={this.state.result}/>
      <input type="submit" value='提交'/>
      </form>
    }
  })

  ReactDOM.render(
  <FormComponent/>,
  document.getElementById('example')
  )

</script>

</body>
</html>

React 表单控件onSubmit的更多相关文章

  1. react 项目实战（四）组件化表单/表单控件 高阶组件

    高阶组件:formProvider 高阶组件就是返回组件的组件(函数) 为什么要通过一个组件去返回另一个组件? 使用高阶组件可以在不修改原组件代码的情况下,修改原组件的行为或增强功能. 我们现在已经有 ...

  2. wicket基础应用(2)--wicket表单控件的使用

    该文可以转载,但转载必须注明作者,出处: 作者:lhx1026 出处:http://lhx1026.iteye.com/ 这一章介绍wicket表单控件的简单应用 1.Label控件 这个应该说是最常 ...

  3. angular 响应式自定义表单控件—注册头像实例

    1. 组件继承ControlValueAccessor,ControlValueAccessor接口需要实现三个必选方法 writeValue() 用于向元素中写入值,获取表单的元素的元素值 regi ...

  4. js进阶 9-6 js如何通过name访问指定指定表单控件

    js进阶 9-6 js如何通过name访问指定指定表单控件 一.总结 一句话总结:form中控件的三种访问方式:2formElement 1document 1.form中控件的三种访问方式? 1.f ...

  5. “此网页上的某个 Web 部件或 Web 表单控件无法显示或导入。找不到该类型，或该类型未注册为安全类型。”

    自从vs装了Resharper,看见提示总是手贱的想去改掉它.于是乎手一抖,把一个 可视web部件的命名空间给改了. 喏,从LibrarySharePoint.WebPart.LibraryAddEd ...

  6. MVC树控件,mvc中应用treeview，实现复选框树的多层级表单控件

    类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...

  7. AnjularJS系列2 —— 表单控件功能相关指令

    第二篇,表单控件功能相关指令. ng-checked控制radio和checkbox的选中状态 ng-selected控制下拉框的选中状态 ng-disabled控制失效状态 ng-multiple控 ...

  8. 基于CkEditor实现.net在线开发之路（3）常用From表单控件介绍与说明

    上一章已经简单介绍了CKEditor控件可以编写C#代码,然后可以通过ajax去调用,但是要在网页上面编写所有C#后台逻辑,肯定痛苦死了,不说实现复杂的逻辑,就算实现一个简单增删改查,都会让人头痛欲裂 ...

  9. Vue#表单控件绑定

    使用v-model 在表单控件上实现数据双向绑定. 单选:https://jsfiddle.net/miloer/bs49p0fx/ <input type="checkbox&quo ...

随机推荐

  1. smartpass

    1.smartpass 是用户注册后,产生的用户名密码 与每个摄像头的用户名密码不一致 2.每个设备初始化登录密码为admin admin,如果需要修改,则在进入该设备IP地址,设置——>用户管 ...

  2. QT中PRO文件写法的详细介绍

    学习Qt时,发现有些知识看了不经常用就忘了,以下是书本上写的一些关于qmake的相关知识,自己看后,打算把一些经常用到的记下来,整理整理. Qt程序一般使用Qt提供的qmake工具来编译. qmake ...

  3. ASP.NET quartz 定时任务

    1.下载 2.使用例子 Demo 概述:Quartz 是开源的定时任务工具类,默认每隔10秒执行一次任务,相当于C#的Timer,不断的循环执行(Start 方法),也可以随时停止(ShutDown方 ...

  4. Linux 局域网同步时间

    选择一台能上外网的机器作为时间服务器(都不能上亦可以,任选一台即可,但是只能保证局域网内时间同步) 配置此时间服务器 安装 ntp 在 /etc/ntp.conf 中配置 restrict 127.0 ...

  5. Recurrent Neural Network[CTC]

    0. 背景 1. CTC原理 图 CTC结构图 CTC是看似和HMM有些联系,然后也采用DP来进行求解,将CTC结构图中<RNN输出,CTC层>单独拿出来,得到如下形式: 图 用前向-后向 ...

  6. 火狐浏览器 system error code 1722 rpc服务器不可用和谷歌浏览器的插件application/x-print-ladop不支持

    今天要实现打印的功能,但是火狐浏览器总是出现提示:火狐浏览器 system error code 1722 rpc服务器不可用 后来发现主要是系统服务中的一个windows服务没有打开导致的. 将wi ...

  7. 一篇自己都看不懂的Matrix tree总结

    Matrix tree定理用于连通图生成树计数,由于博主太菜看不懂定理证明,所以本篇博客不提供\(Matrix\ tree\)定理的证明内容(反正这个东西背结论就可以了是吧) 理解\(Matrix\ ...

  8. JS-详解算数运算符"+"

    二元加法运算符“+”可以对两个数字做加法,也可以做字符串连接操作: 当两个操作数都是数字或都是字符串的时候,计算结果是显而易见的.然而对于其他情况来说,则要进行一些必要的类型转换,并且运算符的行为依赖 ...

  9. Newtonsoft的序列化和反序列化

    class test    {        public string a;       public int b;        public byte[] c;        public In ...

  10. 面试3——java集合类总结（Map)

    1.概述: Java 中的map集合使用键值对(key-value)来保持数据,其中值(value)可以重复,键(key)必须唯一,但最多只能有一个key为空,它的主要实现类有HashMap.Hash ...