TextInput

TextInput
/*
* TextInput 是一个允许用户在应用中通过键盘输入文本的基本组件
* 本组件的属性提供了多种特性的配置,如自动完成,自动大小写,占位文字,键盘类型等
* 常用:
* placeholder 占位符
* value 输入框的值
* password 是否密文输入
* editable 是否可编辑
* retureKeyType 键盘return键类型
* onChange 当文本变化时调用(绑定事件)
* onEndEditing 当结束编辑时调用
* onSubmitEditding 当结束编辑,点击提交按钮时调用
*
*
* 练习:点击搜索, alert显示 输入框的值
*
* */


var LessionTextInput = React.createClass({

getInitialState:function () {
return{
inputText:""
}
},
//输入框的onChange事件,有一个参数
getContennt:function (text) {
this.setState({
inputText:text
});
},


//按钮事件
clickBtn:function () {
alert(this.state.inputText)
},

render:function () {
return(
<View sytle={styles.container}>
<View style={styles.flex}>
<TextInput
style={styles.input}
returnKeyType="search"
placeholder="请输入内容"
        onChangeText={this.getContennt}
           />
</View>
<TouchableOpacity style={styles.btn}>
<Text style={styles.search} onPress={this.clickBtn}>搜索</Text>
</TouchableOpacity>
</View>
);
}
});

var styles = StyleSheet.create({
container:{
flexDirection:"row",
height:45,
marginTop:25
},
flex:{
flex:1
},
input:{
height:45,
borderWidth:1,
borderColor:"#CCC",
borderRadius:4,
marginLeft:5,
padding:5,
},
btn:{
width:55,
marginLeft:5,
marginRight:5,
backgroundColor:"blue",
height:45,
justifyContent:"center",
alignItems:"center"
},
search:{
color:"#FFF"
}
});

转载于:https://www.cnblogs.com/daxueshan/p/7979671.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/279006.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何使用oracle查询,oracle 表查询

Oracle 的 oracle 表查询通过scott用户下的表来演示如何使用select语句&#xff0c;接下来对emp、dept、salgrade表结构进行解说。emp 雇员表字段名称 数据类型 是否为空 备注-------- ----------- -------- --------EMPNO NUMBER(4) 员工编…

火狐标签在中间_在Firefox中保留未使用的标签

火狐标签在中间If you have a lot of content heavy webpages open in Firefox, it soon adds up on memory usage. The BarTab extension puts unused tabs on hold and keeps them unloaded until you are ready to access them. 如果您在Firefox中打开了大量内容繁重的网页&…

[CQOI2012]模拟工厂 题解(搜索+贪心)

[CQOI2012]模拟工厂 题解(搜索贪心) 标签&#xff1a;题解 阅读体验&#xff1a;https://zybuluo.com/Junlier/note/1327574 链接题目地址&#xff1a;洛谷P3161 BZOJ P2667 这个题练一练综合思想还是不错的。。。&#xff08;然而蒟蒻不会啊&#xff09; 做法 肯定是在能完成某…

上传文件的input问题以及FormData特性

1.input中除了type"file"还要加上name"file"&#xff0c;否则$_FILES为空&#xff0c;input的name值就是为了区分每一个input的 2.var formdata new FormData($("#form")[0]); 或者var formdata new FormData(document.getElementById("f…

iphone手机备忘录迁移_如何在iPhone和iPad上使用语音备忘录

iphone手机备忘录迁移Whether you’re recording a voice message as a reminder of that million dollar idea or catching a snippet of a new song you know you’ll forget, the iPhone and iPad’s Voice Memos app is the perfect tool. 无论您是录制语音消息来提醒这一百…

php 执行文件tar打包,利用tar for windows对大量文件进行快速打包

近期将某些网站换服务器&#xff0c;由于网站数量巨大&#xff0c;加上附件和静态页&#xff0c;文件数量异常多&#xff0c;考虑先打包然后直接传过去。起初尝试用winrar打包&#xff0c;但是发现即使选择”仅储存”速度仍然慢到无法接受&#xff0c;后来想到了tar&#xff0c…

DDD~领域事件中使用分布式事务

对于一个聚合来说&#xff0c;它可能会被附加很多事件&#xff0c;这里我们叫它领域事务&#xff0c;因为一个聚会我们可以把它理解成一个领域&#xff0c;一个业务。对于领域事件不清楚的同学可以看看我的这篇文章《DDD~领域事件与事件总线》&#xff0c;里面有详细的说明&…

如何在PowerPoint中制作打字机或命令行动画

Adding quirky animations to your Microsoft PowerPoint presentation gives your slideshow a little extra life. Not only will adding a typewriter or command line animation entertain your audience, but it will also keep them focused on the text. 在您的Microsof…

oracle中spool卸数,数据卸载--spool的使用

&#xfeff;&#xfeff;引言在项目中&#xff0c;我们经常会遇到数据的卸载、装载需求。卸载就是需要将数据从数据库中导入到文本文件中的需求&#xff0c;这样的方法有很多&#xff0c;比较常用的就是spool命令。装载就是需要将数据从文本文件中导入到数据库中。方法也有很多…

Objective-C中的@property

1.property是什么 Property是声明属性的语法&#xff0c;它可以快速方便的为实例变量创建存取器&#xff0c;并允许我们通过点语法使用存取器。 存取器&#xff08;accessor&#xff09;&#xff1a;指用于获取和设置实例变量的方法。用于获取实例变量值的存取器是getter&#…

Linux基础命令---findfs

findfs 查找指定卷标或者UUID的文件系统对应的设备文件。findfs将搜索系统中的磁盘&#xff0c;寻找具有标签匹配标签或与UUID相等的文件系统。如果找到文件系统&#xff0c;文件系统的设备名称将打印在stdout上。 此命令的适用范围&#xff1a;RedHat、RHEL、Ubuntu、CentOS、…

canvas 平滑运动_什么是电视上的运动平滑?人们为什么讨厌它?

canvas 平滑运动Willy Barton/Shutterstock.com威利巴顿/Shutterstock.comIf you’ve just bought a new TV, you might be wondering why everything you watch feels eerily sped up and smooth, like you’re watching a live broadcast all the time. You’re not imaginin…

linux guard什么进程,使用linux系统性能监控工具KSysguard监控远端主机介绍

KDE System Guard默认的窗口前端图形界面使用传感器(sensors)获得要显示的信息。传感器返回的可以是一个简单的数值或更复杂的信息如表格。针对不同的信息类型都提供了一个或多个显示界面。这些显示界面被组织在多个工作表中&#xff0c;工作表可以独立存储和加载。KSysguard主…

macbook充电_如何判断MacBook是否正在充电

macbook充电2p2play / Shutterstock2p2play / ShutterstockForgetting to charge your MacBook properly overnight can leave you with a headache in the morning. And if you’re troubleshooting a broken MacBook, checking if it’s able to charge is one way to rule o…

mysql记录

当没有用EXISTS引入子查询时&#xff0c;在选择列表中只能指定一个表达式转载于:https://www.cnblogs.com/niuben/p/9920741.html

PIL.Image convert to numpy array

当使用PIL.Image读取图像时&#xff0c;如果直接使用numpy.array()转换会出现错误&#xff1a; lst list() for file_name in os.listdir(dir_image):image PIL.Image.open(file_name)lst.append(image) arr numpy.array(lst) 此时&#xff0c;上述最后一行在执行时会出现错…

NFC服务器在Linux,linux 安装 libnfc ,打开串口PN532

硬件准备&#xff1a;USB转串口4针杜邦线PN532模块IC卡一张(比如门禁卡&#xff0c;饭卡等)软件准备&#xff1a;Ubuntu 物理机一台能够访问互联网1&#xff0c;将PN532与USB转串口连接好,放一张IC卡靠近PN532模块2&#xff0c;安装libnfc&#xff1a;chunliubuntu:~$ sudo apt…

chrome同步_如何在Chrome中打开或关闭同步

chrome同步Google Chrome lets you sync up your Google account to your browser across any device. When enabled, bookmarks, history, passwords, extensions, and themes—among many other settings—sync from your Google account, creating a seamless experience no…

sublime text3搭建react native

Sublime Text 3 搭建React.js开发环境 Sublime有很强的自定义功能&#xff0c;插件库很庞大&#xff0c;针对新语言插件更新很快&#xff0c;配合使用可以快速搭建适配语言的开发环境。 1. babel-sublime 支持ES6&#xff0c; React.js, jsx代码高亮&#xff0c;对 JavaScript,…

linux系统输入指令,详解linux系统输入输出管理和vim的常用功能

####系统中输入输出的管理####1.理解系统的输入输出重定向输入重定向是指把文件导入到命令中&#xff0c;而输出重定向则是把原本要输出到屏幕的数据信息写入到指定文件中。2.管理输入输出的符号##输出重定向> ##重定向正确输2> ##重定向错误输出&> …