用于加载高德地图 SDK 依赖，加载完成，全局将会有 **`window.AMap`** 对象。
npm install @lbh7/react-amap-api-loaderAPILoader
===
用于加载高德地图 SDK 依赖，加载完成，全局将会有 window.AMap 对象。
``jsx`
import { APILoader } from '@lbh7/react-amap';
// 或者单独安装使用
import { APILoader } from '@lbh7/react-amap-api-loader';
~~v4~~ 升级到 v5，APILoader 主要是对 APILoader 做了升级
`diff`
- protocol
- hostAndPath
- callbackName
- plugin
- disableScripts
+ akey
+ plugins
+ AMapUI
+ Loca
>
Map 的父组件必须具有宽度和高度；
`jsx mdx:preview
import React from 'react';
import { Map, APILoader } from '@lbh7/react-amap';
const Demo = () => (
);
export default Demo
`
`jsx mdx:preview
import React from 'react';
import ReactDOM from 'react-dom';
import { Map, APILoader } from '@lbh7/react-amap';
const Demo = () => (
);
export default Demo
`
| 参数 | 说明 | 类型 | 默认值 |
|--------- |-------- |--------- |-------- |
| version | SDK 版本 | string | 2.0 |akey
| ~~akay~~ => | 必填 disableScripts=true 时选填 您需先申请密钥（ak）才可使用该服务。⚠️ 注意申请 Web端(JS API) | string | - |http
| ~~protocol~~ | 协议，默认是根据当前网站协议的 | /https | window.location.protocol |webapi.amap.com/maps
| ~~hostAndPath~~ | 请求 SDK 的前半部分 | string | |load_amap_sdk
| ~~callbackName~~ | 回调函数 | string | |AMap.ToolBar,AMap.Driving
| ~~plugin~~ | 加载一个或者多个插件 | string | - |SDK
| ~~disableScripts~~ | 禁用 加载 | boolean | - |
`typescript['AMap.ToolBar', 'AMap.Driving']
import { PropsWithChildren } from 'react';
export type APILoaderConfig = PropsWithChildren<{
/**
* key 密钥
* 您需先申请密钥(ak)。开发文档说明地址：https://lbs.amap.com/api/javascript-api/guide/abc/prepare
*
* 1. 首先，注册开发者账号，成为高德开放平台开发者
* 2. 登陆之后，在进入「应用管理」 页面「创建新应用」
* 3. 为应用添加 Key，「服务平台」一项请选择「 Web 端 ( JSAPI ) 」
*
*/
akey?: string;
/**
* SDK 包版本，指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
* @default 1.4.15
*/
version?: string;
/**
* 加载一个或者多个插件
* @example
*/
plugins?: string[];
/* 是否加载 AMapUI，缺省不加载 /
AMapUI?: {
/* AMapUI 缺省 1.1 /
version?: string;
/* 需要加载的 AMapUI ui插件 /
plugins?: string[];
};
/* 是否加载 Loca， 缺省不加载 /
Loca?: {
/* Loca 版本，缺省 1.3.2 /
version?: string;
};
}>;
export interface APILoaderProps extends APILoaderConfig { }