Как работают модалы, реагируют на нативные

Question

Я новичок ie, использующий React Native, я пытаюсь сделать модальные для моего приложения. Я прочитал документацию, но это не то же самое для моего приложения. Это мой код:

import React, { Component } from 'react';
import { Text, View, Modal, StyleSheet, Button } from 'react-native';



class App extends Component 
{
  constructor(props)
  {
    super(props);
    this.state = {
      visibleModal: false
    }
  }


  showModal()
  {
    this.setState({ visibleModal : true })
  }

  closeModal()
  {
    this.setState({ visibleModal : false })
  }

  render(){

    return(


      <View style={styles.container}> 
        <Modal visible={this.state.visibleModal}>
          <View>
            <Text> Hello World in Modal </Text>
            <Button title='Close Modal' onPress={ this.closeModal }/>
          </View>
        </Modal>
        <Button title=' Show Modal ' onPress={ this.showModal }/>
      </View>
    )
  }
}



const styles = StyleSheet.create ({
  container: {
    flex: 1,
    textAlign: 'center',
    margin: 100

  }
})
export default App

В этом примере я использовал перекус (https://snack.expo.io/@yepezaurio / hello-реагировать-навигация- | -react-navigation )

Если Вы хорошо умеете использовать React. Я хочу знать две вещи:
1. Что мне нужно знать или чему я должен научиться, чтобы лучше использовать реакцию?
2. Какие технологии или библиотеки необходимы?

Answer 1

На мой взгляд, ваш компонент в модале не имеет размера. Я могу думать только об одном

  <View style={styles.container}> 
        <Modal visible={this.state.visibleModal}>
          <View style={styles.container>
            <Text> Hello World in Modal </Text>
            <Button title='Close Modal' onPress={ this.closeModal }/>
          </View>
        </Modal>
        <Button title=' Show Modal ' onPress={ this.showModal }/>
 </View>

Если это сейчас работает, я думаю иначе. Спасибо