TouchableHighlightにはモーダルを閉じるのに2つのタップが必要

Question

私は反応ネイティブモードボックスコンポーネントを使用しており、モーダルで閉じるX（閉じる）ビューをモーダルで持っています。問題は、Xをタップすると状態は変わりますが、モーダルは閉じず、2回目のタップはトリックを行います。

私は、コンポーネントのすべての親ScrollView（複数可）をチェックし、
keyboardShouldPersistTaps =「常に」が効果を追加しました。助言がありますか？

constructor(props) { 
     super(props) 
     this.state = { 
      modalOpen: false, 
      swipeToClose: true 
     } 
    } 



    modalVisibility(){ 
    this.setState({ 
     modalOpen: !this.state.modalOpen 
    }) 
    } 

render() { 
    return (
     <Modal 
      ref={"modal"} 
      isOpen={this.state.modalOpen} 
      swipeToClose={false}> 
      <TouchableHighlight 
       onPress={() => this.modalVisibility()} 
       underlayColor="transparent" 
       style={styles.closeModal} 
       > 
       <Text 
       X 
       </Text> 
      </TouchableHighlight> 
     </Modal> 
) 
} 

Answer 1

私がすぐに知ることは、modalVisibility()に2通りの方法で電話することです。第一は、メソッドインスタンスを呼び出すのに対し、 'X' に取り付け

1. this.modalVisibility()
2. this.props.modalVisibility()

第二は、親を呼び出すだろう。そこで何が起こっているのかを知るには、完全なコンポーネントを確認する必要があります。

Modalの値はisOpenであるため、問題のトラブルシューティングに役立てるために、React Dev Tools内でモーダルの可視性を切り替えることができます。