React 本机不变冲突:元素类型无效



我正在使用 React Native 构建一个 iOS 应用程序,我正在尝试显示地图。但是,我遇到了一个问题。每当我尝试显示MapView元素时,都会收到以下错误:

Invariant Violation: Element type is invalid: expected a string (for
built-in components) or a class/function (for composite components) 
but got: undefined. You likely forgot to export your component from 
the file it's defined in.
Check the render method of `Main`.
This error is located at:
    in Main (at App.js:69)
    in App (at renderApplication.js:35)
    in RCTView (at View.js:113)
    in View (at AppContainer.js:102)
    in RCTView (at View.js:113)
    in View (at AppContainer.js:122)
    in AppContainer (at renderApplication.js:34)
createFiberFromElementType
    ReactNativeFiber-dev.js:974:90
createFiberFromElement
    ReactNativeFiber-dev.js:954:20
reconcileSingleElement
    ReactNativeFiber-dev.js:1403:26
reconcileChildFibers
    ReactNativeFiber-dev.js:1457:40
reconcileChildrenAtPriority
    ReactNativeFiber-dev.js:1634:54
reconcileChildren
    ReactNativeFiber-dev.js:1631:12
finishClassComponent
    ReactNativeFiber-dev.js:1669:12
updateClassComponent
    ReactNativeFiber-dev.js:1659:12
beginWork
    ReactNativeFiber-dev.js:1786:23

这是我Main组件,它与 React Native 网站上的 MapView 文档中演示的完全相同(除了我将showsUserLocation设置为 false ,这不会导致错误(:

import React, { Component } from 'react';
import { MapView } from 'react-native';
class Main extends Component {
  render() {
    return (
      <MapView
        style={{height: 200, margin: 40}}
        showsUserLocation={false}
      />
    );
  }
}
export default Main;

错误是指 App.js 中的第 69 行,这是 render 方法中的return语句。为了完整起见,这是App类:

import React, { Component } from 'react';
import MainIOS from "./ios/Main";
class App extends Component<{}> {
  render() {
    return (<MainIOS />);
    )
  }
}
export default App;

如何解决此问题?我不喜欢使用任何第三方软件包或库,而只是使用标准的 React Native 组件。

正如它在 MapView 的 react-native 文档中指出的那样 (v0.38(,

地图视图

重要提示:此组件现已弃用,将于 2017 年 1 月删除(React Native 版本 0.42(。此组件 仅支持 iOS。

请使用react-native-maps by Airbnb 而不是这个 元件。我们在Airbnb的朋友在建立 跨平台MapView功能更完整的组件。它 被广泛使用(超过 9K 安装/月(。

相关内容

最新更新