React native 将内容从ComponentDidMount呈现到<；视图>；

我该怎么办？我试图呈现初始区域的内容，这样一旦应用程序加载，它就会自动获得位置的经度和纬度并显示在屏幕上。 我只是有点搞不清楚该怎么做，我的源代码就是这样给出的

import React, { Component } from 'react';
import { View, Text , StyleSheet, Dimensions } from 'react-native';
import MapView from 'react-native-maps';

export default class HomePage extends Component {
  constructor(props) {
    super(props);

  }

  componentDidMount(){
    navigator.geolocation.getCurrentPosition((position)=>{
      var lat = parseFloat(position.coords.latitude)
      var long = parseFloat(position.coords.longitude)
      var initialRegion ={
        latitude: lat,
        longitude: long,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421
      }
      this.setState({ initialRegion: initialRegion })
    },
      (error) => aalert(JSON.stringify(error)),
      {
        enableHighAccuracy: true, timeout: 20000, maximumAge: 1000
      });
  }

  render() {
    return (
      <View style={styles.container}>
          <MapView style={styles.map}
            initialRegion={this.state.initialRegion}
            showsUserLocation={true}>
            </MapView>
      </View>
    );
  }
}


const styles=StyleSheet.create({
  container:{
      flex: 1,
    },mapContainer: {
      flex: 1,
    },
    map: {
      flex: 1,
      width: Dimensions.get("window").width,
      height: Dimensions.get("window").height,
    }
});

import React，{Component}来自'React'；
从“react native”导入{视图、文本、样式表、维度}；
从“react native maps”导入MapView；
导出默认类扩展组件{
建造师（道具）{
超级（道具）；
}
componentDidMount（）{
navigator.geolocation.getCurrentPosition（（位置）=>{
var lat=parseFloat（位置坐标纬度）
var long=parseFloat（position.coords.longitude）
初始值区域={
纬度：纬度，
经度：长，
纬度德尔塔：0.0922，
纵向德尔塔：0.0421
}
this.setState（{initialRegion:initialRegion}）
},
（错误）=>aalert（JSON.stringify（错误）），
{
EnableHighAccurance:真，超时：20000，最大值：1000
});
}
render（）{
返回(
);
}
}
const styles=StyleSheet.create({
容器：{
弹性：1，
}，映射容器：{
弹性：1，
},
地图：{
弹性：1，
宽度：尺寸。获取（“窗口”）。宽度，
高度：尺寸。获取（“窗口”）。高度，
}
});

---

关于我如何做那样的事，有什么坦率的建议吗？请协助。

我猜您的地图加载时没有

初始区域

，因为您在第一次渲染（componentDidMount）后执行请求。您可以尝试在获得必要信息之前阻止地图加载，我也已在构造函数上启动了您的状态。代码如下所示：

import React，{Component}来自'React'；
从“react native”导入{视图、文本、样式表、维度}；
从“react native maps”导入MapView；
导出默认类扩展组件{
建造师（道具）{
超级（道具）；
此.state={
initialRegion:空
}
}
componentDidMount（）{
navigator.geolocation.getCurrentPosition（（位置）=>{
var lat=parseFloat（位置坐标纬度）
var long=parseFloat（position.coords.longitude）
变量初始值区域={
纬度：纬度，
经度：长，
纬度德尔塔：0.0922，
纵向德尔塔：0.0421
}
this.setState（{initialRegion:initialRegion}）
},
（错误）=>aalert（JSON.stringify（错误）），
{
EnableHighAccurance:真，超时：20000，最大值：1000
});
}
render（）{
返回(
{this.state.initialRegion！==null&&(
)}
);
}
}

祝你的项目成功