react中使用amap(高德地图)

3,691 阅读1分钟

在React中使用高德地图,有两种方式



1.饿了么封装的React-AMap组件

通过npm install --save react-amap 引入。

NPM地址:www.npmjs.com/package/rea…


React-Amap 使用指南:elemefe.github.io/react-amap/…


2.通过CDN的方式引入(如果你要用AMap官网提供的API,推荐这种方式)


AMap官网:lbs.amap.com/


在react的HTML中引入CDN
<script src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值"></script>

使用API需要你去申请一个key,在如下截图控制台中中申请



注意:在cdn中,你用到哪些AMap的插件,就要在cdn中引入,具体的引入方法,见lbs.amap.com/api/javascr…


我封装了一个react-amap基于placeSearch插件(行政区域搜索)的组件,有兴趣的小伙伴可以参考下

git地址

github.com/961998264/r…