react中实现删除输入框中的内容

import React,{Component} from 'react'
class Clear extends Component{
constructor(props){
super(props)
this.state={
data:''
}
}
updateState=(e)=>{
this.setState({data:e.target.value})
}
clearInput=()=>{
this.setState({data:''})
this.myInput.focus()
}
render(){
return(
<div>
<input value={this.state.data} onChange={this.updateState} ref={myInput=>this.myInput=myInput}></input>
<button onClick={this.clearInput}>Clear</button>
<h4>{this.state.data}</h4>
</div>
)
}
}
export default Clear

react实现删除输入框内容的更多相关文章

  1. [Android]自己定义带删除输入框

    在项目开发中,带删除button输入框也是人们经常常使用到的,该文章便介绍一下怎样创建一个带删除输入框.当中,须要解决的问题例如以下: a)创建自己定义editText类 b)在自己定义editTex ...

  2. TextWatcher-监听输入框内容变化

    今天在做邮件登录的时候,遇到了输入框(Edittext)监听事件(TextWatcher),现在记录下. 首先看如下代码 eText.addTextChangedListener(new TextWa ...

  3. input输入框内容变化实时监听

    js实现的文本框内容发生改变立马触发事件简单介绍:本章节介绍一下如何在文本框的内容发生变化的时候,立马触发一个事件执行响应的操作,而不是像是keydown或者keyup事件一样,只能够检测通过键盘输入 ...

  4. 【react】input输入框可输入的最好实现方式

    使用的是refs.react中输入框不能直接定义value.输入框是可变的,react会提示报错.需要使用的inChange事件(输入框内容被改变时触发). 要定义输入框初始值,需要在componen ...

  5. 使用grep恢复被删除文件内容【转】

    http://www.cnblogs.com/ggjucheng/archive/2012/10/07/2714311.html Unix/Linux下,最危险的命令恐怕就属rm命令了,每次在root ...

  6. chrome 31删除输入框的历史记录

    chrome 31删除输入框的历史记录 TMD居然要用Shift + delete 了....  为毛!!!

  7. Linux Vi 删除全部内容,删除某行到结尾,删除某段内容 的方法

    1.打开文件 vi filename 2.转到文件结尾 G 或转到第9行 9G 3.删除所有内容(先用G转到文件尾) ,使用: :1,.d 或者删除第9行到第200行的内容(先用200G转到第200行 ...

  8. 【转】【JavaScript】禁用backspace键的后退功能,但是可以删除文本内容

    在JavaScript中添加以下代码,就可实现 禁用backspace键的后退功能,但是可以删除文本内容 // 禁用backspace键的后退功能,但是可以删除文本内容 document.onkeyd ...

  9. Java基础知识强化之IO流笔记15:递归之删除带内容的目录案例

    1. 需求:递归删除带内容的目录 分析:   (1)封装目录   (2)获取该目录下的所有文件或者文件夹的File数组   (3)遍历该File数组,得到每一个File对象   (4)判断该File对 ...

随机推荐

  1. Linux系统下CPU使用(load average)梳理

    在平时的运维工作中,当一台服务器的性能出现问题时,通常会去看当前的CPU使用情况,尤其是看下CPU的负载情况(load average).对一般的系统来说,根据cpu数量去判断.比如有2颗cup的机器 ...

  2. vue自定义公共组件components||在vue中,解决修改后的数据不能渲染到dom上的bug

    //主页面框架用来嵌入:Main.vue <el-col :span="24" > * { margin: 0; padding: 0; } html { width: ...

  3. Java的首次学习和了解

    先来说说自己对于Java的了解.Java是一种面向对象的语言,而c++则是面向过程的.Java在网页的开发设计制作过程中必不可少,另外我们还可以用它来做手机的移动开发,还有一些基于服务器的架构设计.J ...

  4. JUnit4 单元测试

    一. 题目简介 这次的单元测试我作了一个基本运算的程序,该程序实现了加,减,乘,除,平方,倒数的运算,该程序进行测试比较的简单,对于初步接触JUnit的我来说测试起来也比较容易理解. 二.源码的git ...

  5. SQLserver 进程被死锁问题解决

    事务(进程ID xx)与另一个进程被死锁在 锁|通信缓冲区 资源上,并且已被选座死锁牺牲品.请重新运行该事务.Sqlserver 当出现这个错误时,如下图: 解决办法:更改数据库事务隔离级别 alte ...

  6. 【转】七牛免费SSL证书,配置自定义域名CDN加速

    原文链接:https://excaliburhan.com/post/use-qiniu-ssl-and-cdn.html 申请七牛SSL证书 其实,七牛在很早之前就支持CDN使用https,但是他要 ...

  7. “i词汇”宣传文案

    目录 "i词汇"微信小程序 队名 :颜罗王team 成员: 姓名 学号 杨雪莹(PM) 201521123005 林楚虹 201521123002 董美凤 201521123003 ...

  8. Comparer Under Centos 7

    Kompare 效果还行.

  9. [CB]IPv6 在中国 - 大规模部署进行中 进展明显

    IPv6 在中国 - 大规模部署进行中 进展明显 2019年02月04日 08:21 3078 次阅读 稿源:solidot 0 条评论 中国有着世界上最大的网民人口,但它的 IPv6 普及度却处于世 ...

  10. 深入理解 Laravel 中 config 配置加载原理

    Laravel的配置加载其实就是加载config目录下所有文件配置.如何过使用php artisan config:cache则会把加载的配置合并到一个配置文件中,下次请求就不会再去加载config目 ...