TouchableHighlight需要兩個水龍頭來關閉模式

Question

我正在使用react-native-modalbox組件並且具有處理模式關閉的模式中的X（關閉）視圖。問題是，當點擊X時狀態改變了，但模式沒有關閉，第二次點擊就可以實現。

我檢查了組件的所有父滾動型（S），並加入
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()。

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

第二，附着在 'X' 將調用到父，而第一將調用一個方法實例。我們需要查看完整的組件才能知道那裏發生了什麼。

但是，由於Modal取值爲isOpen，因此您應該能夠在React Dev Tools本身內切換模態可見性，以幫助您對其進行故障排除。