如何在 React Native 的嵌套 Touchable 中传播触摸事件? [英] How can I propagate touch event in nested Touchable in React Native?

问题描述

在我的应用程序中，我有一个嵌套的 Touchable 元素.每次我按下其中一个，我只得到一个事件.我可以将内部向下传播到层吗?提前致谢！

In my app I have a nested Touchable element. Every time I press on one of them, I got only one event. Can I propagate the inner downward the layer? Thanks in advance!

代码如下:

    <TouchableHighlight style={{ flex: 1 }} onPress={() => { console.log('outer press') }}>
        <TouchableHighlight style={{ flex: 0.8, backgroundColor: 'blue' }} onPress={() => { console.log('inner press') }}>
            <Text>1</Text>
        </TouchableHighlight>
    </TouchableHighlight>

推荐答案

一个 Touchables 包含一个本地状态，它是本地的，其他 Touchables 是 不知道.

A Touchables contains one local state, that is native to it and the other Touchables are not aware of it.

因此，当您触摸嵌套的 Touchable 时，事件会传播到访问状态的子元素，并且除非完成，否则不会释放资源

So when you touch a nested Touchable, the event gets propogated to the child element that access the state and does not release the resource unless it is complete

这里是嵌套 buttons 的生命周期，如 docs

Here would be the life cycle in your case for the nested buttons, as mentioned in the docs

Parent: Parent Touchable
Child: Child Touchable

Parent onStartShouldSetResponder > Parent onResponderGrant > Parent onResponderTerminationRequest > Parent onResponderTerminate > Child onStartShouldSetResponder > Child onResponderGrant > Child onResponderRelease

由于 onResponderReject

如果父 View 想要防止孩子在触摸开始时成为响应者，它应该有一个返回 true 的 onStartShouldSetResponderCapture 处理程序.

If a parent View wants to prevent the child from becoming responder on a touch start, it should have a onStartShouldSetResponderCapture handler which returns true.

您可以查看此视频

这篇关于如何在 React Native 的嵌套 Touchable 中传播触摸事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！