模态如何在本机反应中工作

Question

我是使用 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-navigation ）

如果你擅长使用 React，我想知道两件事：
1. 为了更好地使用 React，我需要知道什么或应该学习什么？
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>

如果它现在正在工作，我认为其他方式。 谢谢