在原生状态下返回自定义警报

我试图从触摸突出显示的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

在原生状态下返回自定义警报

回答

相关问题