美文网首页
React按钮的事件处理 按钮关联的四个事件

React按钮的事件处理 按钮关联的四个事件

作者: 以德扶人 | 来源:发表于2017-09-06 15:39 被阅读274次

React按钮的事件处理 按钮关联了四个事件:
1. 按钮按下事件:onPress - 按下并松开按钮,会触发该事件(相当于PC的onclick)
2. 按钮长按事件:onLongPress - 按住按钮不松开,会触发该事件(长按事件)
3. 按钮按下事件:onPressIn - 按下按钮不松开,会触发该事件(相当于PC的onkeydown)
4. 按钮松开事件:onPressOut - 按下按钮后松开,或按下按钮后移动手指到按钮区域外,都会触发该事件(相当于PC的onkeyup)

发送语音的时候,就可以用onPressIn onPressOut 这2个方法搭配了

React Native的提供了四种点击事件

TouchableHighlight
TouchableNativeFeedback
TouchableOpacity
TouchableWithoutFeedback

其实可以将点击事件当成一个特殊的UI组件, 将这个特殊的UI组件包在UI组件的外面,就可以使指定的UI组件有了点击响应能力。

TouchableHighlight

这是点击透明度发生变化

activeOpacity={0.7}
按下后背景颜色
underlayColor={'red'}

TouchableNativeFeedback

Android设备原生控件

TouchableOpacity

点击背景透明度变化activeOpacity={0.7}

TouchableWithoutFeedback

没有任何反馈效果的

相关文章

  • React按钮的事件处理 按钮关联的四个事件

    React按钮的事件处理 按钮关联了四个事件:1. 按钮按下事件:onPress - 按下并松开...

  • 基础二:事件处理程序

    事件的三个要素 事件源 事件类型 事件处理函数如,给id为myBtn的按钮绑定一个事件处理程序,点击这个按钮显示,...

  • runtime 关联对象的简单运用

    一.关联对象 简单给UIButton添加一个分类,功能为按钮添加一个block处理按钮的点击事件。 objc_se...

  • 使用Active控件

    按钮 VBA中设置按钮的属性 按钮的事件 按钮最重要的事件 -- 点击点击就触发一次事件 标签 单选按钮控件 同...

  • Swift学习笔记(0.1---循环按钮 ScrollView

    循环按钮+ScrollView处理点击事件 目的:控制器的scroll联动上方按钮的 按钮的创建,这个按钮的多少取...

  • 2020-03-17

    input按钮中的onclick事件 input按钮onclick事件大全

  • vue事件修饰符 数据绑定与css样式

    事件修饰符 点击按钮先出发按钮的点击事件再触发div的点击事件,这就是事件冒泡 .stop阻止冒泡,点击按钮只触发...

  • react中绑定this

    在开发过程中,react定义的组件中,如果不为事件处理程序绑定this: 当我点击按钮,页面将报错,我将this打...

  • iOS响应链

    突出按钮点击事件 扩大事件区域 只有继承UIResponder的的类,才能处理事件UIApplication接收事...

  • 用block将视图中的点击事件写出去

    第一步,加入这个宏 第二步,设置按钮的点击事件属性block 第三步,在按钮的点击事件中和block属性关联 第四...

网友评论

      本文标题:React按钮的事件处理 按钮关联的四个事件

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