react-native-amap3d手动引入到reactNative项目

背景

react-native-amap3d是高德地图的RN组件,笔者react-native版本为0.59.9 依照API引入到项目中各种报错。
原因：react-native link没有link进去，需要手动引入，引入方法见下面“解决方案”
例如：

Invariant Violation: Invariant Violation: requireNativeComponent: "AMapView" was not found in the UIManager.

使用

import { MapView } from "react-native-amap3d";
 render() {
    return (
      <>
        <MapView
          coordinate={{
            latitude: 39.91095,
            longitude: 116.37296,
          }}
          style={{ width: "100%", height: "100%" }}//必须设置宽高，否则不显示
        />
    </>)
    }

解决方案

安卓

android文件夹下

settings.gradle添加

include ':react-native-amap3d'
project(':react-native-amap3d').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-amap3d/lib/android')

app/src/main/项目名/MainApplication.java
添加

import cn.qiuxiang.react.amap3d.AMap3DPackage;

添加

 @Override
    protected List<ReactPackage> getPackages() {

      return Arrays.<ReactPackage>asList(
             new AMap3DPackage(),
             ...
             );
    }

app/build.gradle 添加

dependencies {
     implementation project(':react-native-amap3d')
     ...
     }

IOS

ios文件夹下
Podfile添加

   pod 'react-native-amap3d', :path => '../node_modules/react-native-amap3d/lib/ios'

进入ios文件夹下

pod install

项目文件夹/AppDelegate.m添加

 #import <AMapFoundationKit/AMapFoundationKit.h>
 [AMapServices sharedServices].apiKey = @"高德key";

注意点

安卓模拟器运行地图闪退，需要真机调试。不要慌