我正在寻找一个解决方案,它允许我从父组件响应所有子组件的新闻事件(包括嵌套在其他组件中的查尔兹)。特别是,我对新闻发布事件(如TouchableOpacity的onPressOut等)感兴趣。
我不想打断子组件对该事件的响应,我只想进一步响应该事件以执行其他任务。因此,我不能在父组件上使用捕获阶段,因为它将停止在链中进一步传播事件。
我也不想手动为父对象的每个子对象添加按下响应功能,因为这样会有很多查尔兹,而且这会成为一项乏味的任务,尤其是在重构或重新实现时。
在Bubbling事件阶段,父TouchableOpacity组件允许我在没有子组件响应的情况下捕获所有press事件。但是,如果子组件响应了这些事件,则事件不会在链中进一步向上传播,因此,它永远不会到达父TouchableOpacity。
在代码中:
<TouchableOpacity onPressOut={ this.doSomethingInParentWhenAChildIsPressed >
<TouchableOpacity onPressOut={()=>{
/* doing something in child, parent should react in addition to this */
} />
<View>
<TouchableOpacity onPressOut={()=>{
/* doing something in nested child, parent should react in addition to this */
} />
</View>
<View>
<Text>When this text is pressed, the parent TouchableOpacity responds</Text>
<View>
<TouchableOpacity onPressOut={()=>{
/* doing something in other nested child, parent should react in addition to this */
} />
</View>
<View>
<Text>The parent TouchableOpacity also responds on this text being pressed</Text>
</View>
</View>
</TouchableOpacity>
你知道有什么方法可以做到这一点吗?
是否有可能以某种方式从父级捕获触摸启动事件,同时仍然允许事件在链中进一步传播?我正在寻找任何允许我创建合成事件并在React Native中发出它的东西,但我无法找到任何解决方案。
1条答案
按热度按时间cwxwcias1#
您可以定义一个函数,当按下父级时调用该函数,当按下子级时调用同一个函数。
查看此堆栈示例:https://snack.expo.io/@ashwith00/4ddff3