美文网首页
react输入表单提交

react输入表单提交

作者: danihay | 来源:发表于2017-08-31 22:28 被阅读1015次

1.在构造函数,继承下面设置默认属性值,对于带id的回填很有用。并且绑定事件。

this.state ={ name:'dani',age:24,  }

this.onChangeValue  =  this.onChangeValue.bind(this)  //提升this作用域

2.在input框内输入设置默认值,input的name,以及绑定onChange事件。

<input type=“text” name=“name” onChage={this.onChangeValue} defaultValue={this.state.name}  />

其余input框也是类似的写法

3.在绑定的事件里面设置值

onChangeValue(e){

      this.setState = ({

        [e.target.name]  :  e.target.value;

      })

}

4.当提交的时候直接获取this.state即可得到input表单的所有内容。

相关文章

  • react输入表单提交

    1.在构造函数,继承下面设置默认属性值,对于带id的回填很有用。并且绑定事件。 this.state ={ nam...

  • html基础

    表单标签及输入类型 action 提交表单地址,method提交方式:get,post 输入文本框 ...

  • HTML表单

    HTML使用表单向服务器提交请求,表单、表单控件的主要作用就是收集用户输入,当用户提交表单时,用户输入内容将被作为...

  • HTML表单的用法

    HTML表单(form)用于采集和提交用户输入的信息。示例代码如下: action:当提交表单时,发送表单数...

  • 任务五-主线

    HTMLform表单(1) HTML表单用于搜集不同类型的用户输入,提交给网站后台 往哪去提交,提交给谁,提交按钮...

  • HTML 表单的用法

    表单表单作用:HTML表单用于搜集不同类型的用户输入。 表单的工作机制访问一个含有表单的页面输入数据后,提交表单→...

  • HTML 表单的用法

    HTML表单 form表单 form表单用于把用户输入的数据提交给后台服务器name表示提交的表单名称,actio...

  • form表单

    form表单的作用form用于把用户输入的数据提交到后台 name:表单提交时的名称action:提交到的地址...

  • React学习笔记_03

    React 表单处理 表单受控组件 html中的表单元素是可输入的,也就是有自己的可变状态 React中可变状态通...

  • HTML 表单的用法

    表单用于收集用户输入。用来包裹其他元素,action属性制定表单提交的地址,method属性定义表单提交所使用的h...

网友评论

      本文标题:react输入表单提交

      本文链接:https://www.haomeiwen.com/subject/xmgcjxtx.html