单击模态外部隐藏模态反应母语

Question

我想通过单击ScrollView组件中的任意位置来隐藏模态。我尝试使用ScrollView将View内的所有组件包裹起来，并使用TouchableWithoutFeed包装视图。但是当这个模式流行音乐时，这个Touchable似乎根本不起作用。

Answer 1

点击ScrollView的{​​{1}}后，您可以将组件状态onClick()切换为false。这将隐藏模态。

showMoreModal

Answer 2

首先不要在Modal内使用ScrollView。在模态中添加TouchableWithoutFeedback以隐藏/关闭模态。

return (
  <View style={{flex: 1}}>
    <ScrollView>
      {...} <-------- Scroll Content
    </ScrollView>
    <Modal>
      <TouchableWithoutFeedback
        onPress={() => this.setState({ showModal: false })}
      >
        <View style={{position: 'absolute', top: 0, right: 0, left: 0, bottom: 0}}>
          {...} <-------- Modal Content
        </View>
      </TouchableWithoutFeedback>
    </Modal>
  </View>
);