给类型为text的input设置value值后就无法修改了

我的页面显示为如下但是退格却无法改变他的值

原来是缺少onChange事件,没法监听value的改变

所以需要添加

onChange={this.handleChange.bind(this)}

HandleChange 函数这么写

handleChange(e){
this.setState({phoneNum: e.target.value});
}

那探索下 如果假设有多个input 在setState中设置的值不一样呢

很简单这样改

onChange={this.handleChange.bind(this,"address")

HandleChange函数这样改

handleChange(attr,e){

this.setState({[attr]: e.target.value});

}

这样就可以根据传入不同的值进行赋值了

给类型为text的input设置value值却无法修改的更多相关文章

  1. miniUI input设置默认值,js获取年月注意事项,数据库nvl函数使用

    2017-6-5周一,今天碰到的一个需求是:两税附征模块进入页面筛选时间默认值为当前月的上一个月,并根据筛选结果显示数据,我们用的框架为miniUI. 坑1: 默认值设置,刚刚接触miniUI,对里面 ...

  2. 如何为一个类型为Color的属性设置默认值

    最近在研究GDI+的时候,用winform来写自定义控件遇到需要为控件的属性设置默认值,但这个属性的类型是System.Drawing.Color.本文只是总结一下各种设置的方法. Example [ ...

  3. react input 设置默认值

    1.text类型 <input type="text" value={默认值} />  ,这种写法可以显示默认值,但不能对输入框进行编辑 正确写法: <input ...

  4. ng-option指令使用记录,设置默认值需要注意

    ng-options一般有以下用法: 数组作为数据源: label for value in array select as label for value in array label group ...

  5. 001. 为input type=text 时设置默认值

    1. 前端HTML代码 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Defa ...

  6. MySql折腾小记二:text/blog类型不允许设置默认值,不允许存在两个CURRENT_TIMESTAMP

    From: http://www.cnblogs.com/cyq1162/archive/2011/05/17/2049055.html 在 CYQ.Data 数据框架的反向工程中,遇到MySQL的问 ...

  7. 基于layui,Jquery 表格动态编辑 设置 编辑值为 int 或者 double 类型及默认值

    首先先推荐大家在看这篇笔记时,阅读过我写的这篇 Layui表格编辑[不依赖Layui的动态table加载] 阅读过上面那篇笔记之后呢,才能更好的理解我现在所要说的这个东西 接下来废话不多说,上代码. ...

  8. Google Chrome input 设置 line-height 后光标变得和input一样高

    Google Chrome input的height和line-height设置为相同的比默认高度高的值时,当input控件获得焦点并且没有输入内容时,input中的光标会占满整个input控件(如果 ...

  9. 根据条件决定是否为input设置只读属性

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...

随机推荐

  1. 你所必须知道的HTML

    只有在MySQL中可以使用"utf-8"的别名"utf8",但是在其他地方一律使用大写"UTF-8". htm 与 html 的区别  两种 ...

  2. hadoop作业调优参数整理及原理

    hadoop作业调优参数整理及原理 10/22. 2013 1 Map side tuning参数 1.1 MapTask运行内部原理 当map task开始运算,并产生中间数据时,其产生的中间结果并 ...

  3. 阶段4-独挡一面\项目-基于视频压缩的实时监控系统\Sprint1-基于Epoll架构的采集端程序框架设计\第2课-基于Epoll的采集端程序框架设计

    回顾之前的整个程序架构 把epoll机制应用到这个架构上去 下面主要去分析我们的系统中有没有需要等待的事件,先看看采集子系统 在采集子系统当中,摄像头有数据,摄像头采集到图像数据可以作为一个等待事件. ...

  4. 数据库 连接(join)

    转自http://www.cnblogs.com/caozengling/p/5318696.html 数据库中飞内连接,自然连接,外连接 数据库中的连接join氛围内连接,自然连接,外连接,外连接又 ...

  5. charles请求入参中有乱码

    工作中,需要入参,但是发现入参中,有中文的都是乱码,仔细查阅headers,发现Content-Type是application/x-www-form-urlencoded类型,而实际上,入参是jso ...

  6. 33、生鲜电商平台-定时器,定时任务quartz的设计与架构

    说明:任何业务有时候需要系统在某个定点的时刻执行某些任务,比如:凌晨2点统计昨天的报表,早上6点抽取用户下单的佣金. 对于Java开源生鲜电商平台而言,有定时推送客户备货,定时计算卖家今日的收益,定时 ...

  7. Flask 入门(第一篇)

    1. 认识 Flask Flask 是一个微型 Web 框架,依赖于 jinjia2 模板系统和 Werkzeug WSGI(本质为 Socket 服务端) 服务,默认情况不支持数据库抽象层.表单验证 ...

  8. Ubuntu16.4下安装Chrome浏览器以及Chromedriver

    一.Chrome浏览器的安装 对于谷歌Chrome32位版本,使用如下链接: wget https://dl.google.com/linux/direct/google-chrome-stable_ ...

  9. OpenStack基础知识-tox的详解介绍

    1.tox简介 tox是通用的虚拟环境管理和测试命令行工具.tox能够让我们在同一个Host上自定义出多套相互独立且隔离的python环境,每套虚拟环境中可能使用了不同的 Python 拦截器/环境变 ...

  10. 洛谷P3694 邦邦的大合唱站队/签到题

    P3694 邦邦的大合唱站队/签到题 题目背景 BanG Dream!里的所有偶像乐队要一起大合唱,不过在排队上出了一些问题. 题目描述 N个偶像排成一列,他们来自M个不同的乐队.每个团队至少有一个偶 ...