React Native中Pressable与TouchableWithoutFeedback的核心差异是什么？

• 视图渲染逻辑差异
  TouchableWithoutFeedback自身不会生成额外的View渲染节点，仅将触摸事件绑定到它包裹的唯一子组件上，完全不介入布局计算。示例中子组件的flex:1可以直接向上继承到App根容器，所以蓝色背景可以铺满全屏。
  Pressable自身默认会渲染一个独立的View节点，所有触摸事件绑定在这个自身生成的View上。如果不为Pressable指定宽高、flex等布局属性，它默认仅会自适应包裹子内容的尺寸。示例中Pressable没有设置flex:1，所以子组件的flex:1仅相对于Pressable这个父节点生效，Pressable自身高度仅能包裹红色方块，最终蓝色背景仅显示一小条，这就是两个示例布局差异的根本原因。
• 触摸事件处理逻辑差异
  TouchableWithoutFeedback默认会拦截子组件的触摸事件冒泡，仅支持基础的按压、长按回调，没有内置的触摸状态同步能力。
  Pressable的事件逻辑更贴近原生视图的表现，默认不会强制拦截事件冒泡，内置了按压、悬停、聚焦等多种状态的回调能力，同时支持更精细的点击热区、按压延迟等配置。

如果要让Pressable的表现与TouchableWithoutFeedback完全一致，只需给Pressable添加flex:1样式即可，修改后代码如下：

export default function App() {
  return (
    <Pressable style={{flex: 1}} onPress={() => alert("outer pressed")}>
      <View style={styles.container}>
        <View style={styles.box} />
      </View>
    </Pressable>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: 'blue',
  },
  box: {
    width: 50,
    height: 50,
    backgroundColor: 'red',
  }
});

内容的提问来源于stack exchange，提问作者SMhd Asadi