Pressable 和 TouchableOpacity 之间的区别 [英] Difference between Pressable and TouchableOpacity

查看:53
本文介绍了Pressable 和 TouchableOpacity 之间的区别的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

随着react native0.63 版本的更新,出现了新的组件.有经验的人可以解释一下 PressableTouchableOpacity 有何不同以及何时使用它们更好.

解决方案

Pressable 是 RN 0.63 的新介绍,在此之前,Touchable Opacity 是最常用的用于包裹组件或类似组件的组件.

它们的基本功能是相同的,使文本/图像可点击和用户交互.

但是使用 Pressable 你可以访问很多新的道具,比如:

HitRect,这是一个很酷的功能,根据文档:

<块引用>

手指不是最精确的仪器,它很常见用户不小心激活了错误的元素或错过了激活区.为了提供帮助,Pressable 有一个可选的 HitRect 你可以用于定义触摸可以注册远离包裹的距离元素.按下可以在 HitRect 内的任何位置开始.

这显然是我们用于 hitslop 的更好的替代方案,这里它更精确,您可以定义区域.它也不会干扰子/其他组件 Z-index.

所以基本上你可以获得按钮的所有功能,带有很酷的新道具的touchableOpacity.请查看他们的文档:rn-pressable

希望对您有帮助.如有疑问,请放心

With the update react native to version 0.63, new components have appeared. Can someone more experienced explain how the Pressable differs from the TouchableOpacity and when it is better to use them.

解决方案

Pressable was a new introduction to RN 0.63, prior to that,Touchable Opacity was the most common used Component to wrap a component or simliar components.

Both their basic functionalities are same, to make a text/image clickable and user interactive.

But with Pressable you get to access a lot new props like :

HitRect, which is such a cool feature, acc to docs :

Fingers are not the most precise instruments, and it is common for users to accidentally activate the wrong element or miss the activation area. To help, Pressable has an optional HitRect you can use to define how far a touch can register away from the the wrapped element. Presses can start anywhere within a HitRect.

This is clearly a better alternative to what we used for hitslop , here its more precise and you define the area.And it doesnt interfere with the child/other components Z-index too.

So basically you get all the feature of a button, touchableOpacity with cool new props. Do check out thier docs : rn-pressable

Hopeit helps.feel free for doubts

这篇关于Pressable 和 TouchableOpacity 之间的区别的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆