react-native - 地图未显示在内容中

Question

我正在使用带有 Native-Base 的 Expo。尝试了不同的方法来显示地图，但它们都没有按应有的方式工作。在内容内部，它根本没有显示。当我放出内容时，它看起来很糟糕，因为内容在保持固定的同时滚动。当我将 ScrollVew 而不是 Content 再次显示时，它不再显示，当 Map 在 ScrollView 之外时，它显示但它非常糟糕。请帮我解决这个问题。我需要将其作为底部整个内容的一部分。这是代码：

import React, {Component} from "react";
import {View, Image, StyleSheet, Dimensions,InteractionManager, ScrollView} from "react-native";
import {
  Container,
  Header,
  Content,
  Footer,
  FooterTab,
  Button,
  Icon,
  Text,
  Left,
  Right,
  Body,
  Title,
  Thumbnail,
  Grid,
  Row,
  Col,

} from "native-base";

import  typographystyles  from '../styles/typographystyles'; 
import { primary, secondary } from '../styles/variables';
import { MapView } from 'expo';
class PostScreen extends Component {


  render() {

    return (
      <Container>
     <Content>



        <View>  
              <Grid>
              <Row>
       <Col style={styles.col} >

        <Text style={typographystyles.heading1}> Jennifer </Text>
        <Text style={{marginTop:-20, fontSize:16, marginLeft:15}}> Vew and Edit Profile </Text>
       </Col>
<Col style={styles.col}>       
        <Thumbnail style={{marginTop:20}} source={require("../img/profile2.jpg")}/ >
     </Col> 
     </Row>
     </Grid>       

       </View>
       <View style={{marginLeft:15, marginBottom:20}}>
       <Text style={{marginTop:10,marginBottom:10, fontSize:18}}> 90 EUR per night </Text>
       <View style={{flexDirection:'row'}}>
        <Icon name="star" style={{color: primary}} />
         <Icon name="star" style={{color: primary}} />
          <Icon name="star" style={{color: primary}} />
           <Icon name="star" style={{color: primary}} />
            <Icon name="star" style={{color: primary}} />
            <Text style={{marginLeft:10, fontSize:18, color:primary}}> 247 votes </Text>
           </View>


           </View>
           <Text style={{marginLeft:5, marginRight:5}}>
           Lorem ipsum dolor sit amet, eum iisque accommodare cu, ex enim eligendi appareat nec. Magna quando aliquid mel ea, exerci nonumes maiestatis eum ei, harum possim sed ut. Mea omnis bonorum posidonium ne, pri ne illud suavitate assentior. His choro numquam ad, mei te integre vituperatoribus. An vim nobis similique theophrastus, mazim mandamus assentior pro id.

Ad bonorum senserit postulant eum, quo et virtute feugiat. Reque laudem referrentur ex mei. Eu vel dico sonet iudicabit. Eos et falli fabulas, eam quis timeam voluptatum ea. Nullam persequeris ne nec. Reque error vivendum sit id, te sit partem aeterno feugait.
</Text>

   <MapView
        style={{ flex: 1 }}
        initialRegion={{
          latitude: 37.78825,
          longitude: -122.4324,
          latitudeDelta: 0.0922,
          longitudeDelta: 0.0421,
        }}
      />         
     </Content>
     </Container>
    );
  }
}

出了什么问题，我该如何解决？

标签： react-nativereact-native-androidreact-native-iosexponative-base