Javascript react native maps-TypeError:undefined不是对象（正在计算此.state.region'；）

我在尝试嵌入

react native maps

函数时收到此错误消息

react-native-maps - TypeError: undefined is not an object (evaluating '_this.state.region')

我的代码

Home.js

import MapView from 'react-native-maps';

export default () => (
    <MapView 
    style={{
        position: 'absolute',
        top: 0,
        left: 0,
        right: 0,
        bottom: 0,
    }} 
    region={this.state.region} 
    onRegionChange={this.onRegionChange}
  />
);

import MapView from 'react-native-maps';
import { onRegionChange, _values } from "./NewFile";

export default () => (
    <MapView 
    style={{
        position: 'absolute',
        top: 0,
        left: 0,
        right: 0,
        bottom: 0,
    }} 
    region={_values.region}
    onRegionChange={() => onRegionChange() }
  />
  />
);

---

参考：

首先

getInitialState

已被弃用。检查

和工作实例

---

第二个问题是

onRegionChange

函数。您需要绑定或使用箭头函数

您在使用它的上下文中没有状态。i、 e.Home.js中的函数

您应该做的是将组件中的

区域作为无状态映射组件中的道具传递出去

此外，onRegionChange在此处也不可用，因此也将其作为道具传递

您的代码应该如下所示：

import MapView from 'react-native-maps';

 export default ({region, onRegionChange}) => (
   <MapView 
     style={{
       position: 'absolute',
       top: 0,
       left: 0,
       right: 0,
       bottom: 0,
     }} 
     region={region} 
     onRegionChange={onRegionChange}
    />
    );

此外，您不应使用
getInitialState
作为其弃用语法，也不应与
类
语法一起使用

您应该像这样初始化您的状态：

export default class App extends React.Component {
   constructor (props) {
      super (props);
      this.state = {
       ...
       region: {
           latitude: 37.78825,
           longitude: -122.4324,
           latitudeDelta: 0.0922,
           longitudeDelta: 0.0421,
      },
     }
   }
}

另外，您还没有在类中绑定onRegionChanged函数，请使用ES6
=>
运算符进行绑定

onRegionChange = (region) => {
   this.setState({ region });
}

希望这有帮助。快乐编码
 我已经得到了答案。创建新文件以声明新的全局变量和函数

Home.js

import MapView from 'react-native-maps';

export default () => (
    <MapView 
    style={{
        position: 'absolute',
        top: 0,
        left: 0,
        right: 0,
        bottom: 0,
    }} 
    region={this.state.region} 
    onRegionChange={this.onRegionChange}
  />
);

import MapView from 'react-native-maps';
import { onRegionChange, _values } from "./NewFile";

export default () => (
    <MapView 
    style={{
        position: 'absolute',
        top: 0,
        left: 0,
        right: 0,
        bottom: 0,
    }} 
    region={_values.region}
    onRegionChange={() => onRegionChange() }
  />
  />
);

我已经试过了，到目前为止没有错误消息，但似乎没有检测到地图区域的纬度和经度。@MohammadNurdin在地图函数中渲染之前，您可以验证您是否有带数据的区域对象吗？如何验证？我试过了，但什么也没发生。onRegionChange=（region）=>{alert（region）；this.setState（{region}）；}
export const _values = { 
  region: {
        latitude: 37.78825,
        longitude: -122.4324,
        latitudeDelta: 0.0922,
        longitudeDelta: 0.0421,
      }
};

export const onRegionChange = (region) => {
     _values.region = region;
}