TouchableOpacity组件(绑定事件)
来源:互联网 发布:雅米网络兼职接不到单 编辑:程序博客网 时间:2024/05/16 05:40
代码实现(index.ios.js)
//TouchableOpacity组件(绑定事件)import React, {Component} from 'react';import { AppRegistry, StyleSheet, Text, View, TouchableOpacity} from 'react-native';/* React Native 提供了3个组件用于给其他没有触摸事件的组件绑定触摸事件 TouchableOpacity 透明触摸,点击时,组件会出现透明过度效果 TouchableHighlight 高亮触摸,点击时.组件会出现高亮效果 TouchableWithoutFeedback 无反馈性触摸,点击时,组件无视觉变化 需要导入组件*/// 组件var HelloReactNative = React.createClass({ clickBtn:function () { alert("点击搜索"); }, render:function () { return( <View style={styles.container}> <View style={styles.flex}> <View style={styles.input}> </View> </View> <TouchableOpacity style={styles.btn} onPress={this.clickBtn}> <Text style={styles.search}>搜索</Text> </TouchableOpacity> </View> ); }});//样式var styles = StyleSheet.create({ container:{ flexDirection:"row", height:45, marginTop:25 }, flex:{ flex:1 }, input:{ height:45, borderWidth:1, marginLeft:5, paddingLeft:5, borderColor:"#CCC", borderRadius:4 }, btn:{ width:55, marginLeft:5, marginRight:5, backgroundColor:"#2873ff", height:45, justifyContent:"center", alignItems:"center" }, search:{ color:"#FFF", fontSize:15, fontWeight:"bold" }});AppRegistry.registerComponent('HelloReactNative', () => HelloReactNative);
阅读全文
0 0
- TouchableOpacity组件(绑定事件)
- TextInput组件(绑定事件)
- VueJS--给组件绑定原生事件
- Cpage.js给组件绑定事件
- Vue组件绑定自定义事件(子向父传递事件)
- TouchableOpacity使用
- c#如何绑定dll或者ocx组件中的事件
- jqueryEasyUI:tabs扩展:给tabs组件绑定双击事件
- Vue.js 组件中的v-on绑定自定义事件理解
- jQuery向动态添加的组件绑定事件
- Vue之2.x版本父子组件双向绑定事件
- 绑定事件
- 绑定事件
- 绑定事件
- 事件绑定
- 事件绑定
- 事件绑定
- 事件绑定
- Liferay环境搭建以及与Eclipse的使用
- 判断两个Mat图像是否绝对相等
- 动态规划实例(九):最小硬币找零数
- Zookeeper实例Curator API-PathChildrenCache
- JAVA多线程与并发学习总结
- TouchableOpacity组件(绑定事件)
- react学习笔记之setState方法注意事项
- Mac OS修改Mac地址
- wireshark源码探索No.3---README.dissector文档
- 软件工程面试
- SDUT-1244 数列有序
- Zookeeper实例Curator API-PathChildrenCache_NoCacheData
- 动态规划实例(十):矩阵连乘
- 跨域问题