在原生狀態下返回自定義警報

我試圖從觸摸突出顯示的onPress調用中啓動自定義警報組件。我一直無法得到這個工作，我已經嘗試從自定義警報組件渲染功能的控制檯日誌記錄，並且代碼不運行到這一點，因爲我無法看到這個日誌。令我困惑的是，當我使用React-Native Alert對此進行測試時，它確實運行並顯示Alert。我希望能幫助理解我在這裏做錯了什麼，因爲我覺得我誤解了某些東西。我以前使用過Alert組件，它工作正常，但在這些情況下，它只是在我直接從onPress調用Alert時才起作用。在原生狀態下返回自定義警報

onPress() { 
    return (
    <Alert 
     message={i18n('alerts.improvements')} 
    /> 
) 
} 

render() { 
    return (
    <TouchableHighlight onPress={() => this.onPress.bind(this)}> 
     <Text>Test Text</Text> 
    </TouchableHighlight> 
) 
}

Alert組件與控制檯日誌不會被打到：

class Alert extends Component{ 
    props: { 
    message: string 
    } 

    state = { 
    modalVisible: false, 
    } 

    setModalVisible(visible) { 
    this.setState({modalVisible: visible}); 
    } 

    render() { 
    console.log('modal') 
    return (
     <Modal 
     animationStyle='fade' 
     transparent={true} 
     visible={!this.state.modalVisible} 
     onRequestClose={() => {}} 
     > 
     <View style={styles.container}> 
      <Text style={styles.text}>{this.props.message}</Text> 
     </View> 
     </Modal> 
    ) 
    } 
} 

export default Alert

來源

2017-06-23 Lilp

應'<告警消息= {...}>''不消息 = {...}' – Li357

道歉，這是這裏的一個錯字，我已經更新了這個以反映正確的代碼。謝謝 – Lilp

通過將''放入'render'本身，默認顯示爲'true'，它工作正常，然後你的組件代碼正在工作。 –

而不是調用它onPress你可以有默認可見false並將其放置在render。然後再添加一個道具給你的組件，它將管理它的可見性。

例如：

in component: 
    <Modal 
      animationType={'fade'} 
      transparent={true} 
      visible={this.props.isOpen} 
      onRequestClose={this.props.actionClose}> 

while calling: 
<ModalBox 
      isOpen={this.props.isOpen}

我有isOpen丙能見度

來源

2017-06-23 05:19:43

在原生狀態下返回自定義警報

回答

相關問題