模態如何在本機反應中工作

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>

如果它現在正在工作，我認為其他方式。 謝謝