react  表单
this.handleChange(key,e){
  [key]:e.target.value
}

submit=()=>{

  const {userName,age,status}=this.state;
  let parmas = {
    userName,
    age,
    status
  }

}

render(){

  const {userName,age,status}this.state;
  return(

    <div>
      

    <input type="text" value={userName} onClick={this.handleChange.bind(this,'userName')}/> 
    <input type="text" value={age} onClick={this.handleChange.bind(this,'age')}/> 
    <input type="text" value={status} onClick={this.handleChange.bind(this,'status')}/>

    <button onClick={this.submit}>提交</button>

    <div>  

  )
}

react 表单获取多个input的更多相关文章

  1. 七、React表单详解 约束性和非约束性组件 input text checkbox radio select textarea 以及获取表单的内容

    一.约束性和非约束性组件: 非约束性组: MV: <input type="text" defaultValue="a" /> 这个 default ...

  2. JavaWeb后台从input表单获取文本值的两种方式

    JavaWeb后台从input表单获取文本值的两种方式 #### index.html <!DOCTYPE html> <html lang="en"> & ...

  3. 不通过getElementByName实现获取表单数据 (document.form表单的name值.input输入框的name值)

    function update() { //document.form表单的name值.input输入框的name值 var username = document.form1.username; v ...

  4. 微信小程序-form表单-获取用户输入文本框的值

    微信小程序-form表单-获取用户输入文本框的值 <input name='formnickname' class="textarea" placeholder=" ...

  5. 表单相关标签之input标签

    用于搜集用户信息. <input type="text" name="fname" /> 标签属性 type 规定 input 元素的类型.输入字段 ...

  6. PHP入门基础(一)——标记风格、注释、表单获取、字符串类型、变量解析

    PHP标记风格: //XML风格//推荐的标记风格,可以在XML文档中使用 <?php echo '<p>XML Style</p>'; ?> //简短风格——需启 ...

  7. 表单提交中的input、button、submit的区别

    1.input[type=submit] 我们直接来看例子: 代码如下: <form> <input name="name"> <input type ...

  8. 表单提交:button input submit 的区别

    http://harttle.com/2015/08/03/form-submit.html 最近项目代码中的表单提交的方式已经百花齐放了,现在用这篇文章来整理一下不同表单提交方式的区别,给出最佳实践 ...

  9. form表单 获取与赋值

    form表单中使用频繁的组件: 文本框.单选框.多选框.下拉框.文本域form通过getValues()获取表单中所有name的值 通过setValues({key:values})给对应的name值 ...

随机推荐

  1. [LeetCode] 236. Lowest Common Ancestor of a Binary Tree_ Medium tag: DFS, Divide and conquer

    Given a binary tree, find the lowest common ancestor (LCA) of two given nodes in the tree. According ...

  2. python迭代-可迭代对象与迭代器对象

    可迭代对象与迭代器对象 问题举例 某软件要求,从网络抓取各个城市的气温信息,并依次显示: 北京:15~22 上海:18~23 ...... 如果一次抓取所有城市气温信息再显示,显示第一个城市的气温时会 ...

  3. node (02 CommonJs 和 Nodejs 中自定义模块)顺便讲讲module.exports和exports的区别 dependencies 与 devDependencies 之间的区别

    CommonJS 规范的提出,主要是为了弥补当前 JavaScript 没有标准的缺陷.它的终极目标就是:提供一个类似 Python,Ruby 和 Java 语言的标准库,而不只是停留在小脚本程序的阶 ...

  4. 利用spring实现服务启动就自动执行某些操作的2种方式

    第一种方式,用bean的init-method属性 <bean class="com.emax.paycenter.log.LogBridge" init-method=&q ...

  5. 一:window环境,LaTex快速安装(简单易懂)

    一.    下载 清华开源软件镜像:点我下载 在线安装很容易失败,所以咱们选择ISO的~ 二.    安装 解压texlive2018.iso文件,并使用管理员权限打开install-tl-windo ...

  6. IRC 打字交流

    kali 里面用 apt-get install weechat 安装完成后,输入 weechat 命令就能启动客户端了 要想使用 IRC,就需要先连接一个 irc 服务器,选择了大名鼎鼎的 chat ...

  7. Eclipse启动报错An internal error occurred during: "Initializing Java Tooling"

    Eclipse启动报错An internal error occurred during: "Initializing Java Tooling" 解决方案: 删除工作空间work ...

  8. 怎样从外网访问内网OpenLDAP数据库

    外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...

  9. No Directionality widget found

    The problem is not that you have not wrapped your widgets into MaterialApp. As the documentation say ...

  10. Docker Kubernetes 常用命令

    Docker Kubernetes 常用命令 增 # 通过文件名或标准输入创建资源. kubectl create # 读取指定文件内容,进行创建.(配置文件可指定json,yaml文件). kube ...