react使用地图

复制代码
 useEffect(() => {
        const loadAMap = () => {
          return new Promise((resolve, reject) => {
            if (window.AMap) {
              resolve(window.AMap);
            } else {
              const script = document.createElement('script');
              script.src = 'https://webapi.amap.com/maps?v=2.0&key=40335db62d1bb586ba8505e0c06ccac1';
              script.async = true;
              script.onerror = reject;
              script.onload = () => {
                resolve(window.AMap);
              };
              document.head.appendChild(script);
            }
          });
        };
        loadAMap().then((AMap) => {
            new AMap.Map('container', {
              viewMode: '2D',
              zoom: 17,
              center: [116.867982,36.683662 ]
            });
            
          }).catch((error) => {
            console.error('加载地图失败', error);
          })
      }, []);
相关推荐
清山博客3 分钟前
OpenCV 人脸识别和比对工具
前端·webpack·node.js
要加油哦~6 分钟前
AI | 实践教程 - ScreenCoder | 多agents前端代码生成
前端·javascript·人工智能
程序员Sunday8 分钟前
说点不一样的。GPT-5.3 与 Claude Opus 4.6 同时炸场,前端变天了?
前端·gpt·状态模式
yq19820430115614 分钟前
静思书屋:基于Java Web技术栈构建高性能图书信息平台实践
java·开发语言·前端
aPurpleBerry18 分钟前
monorepo (Monolithic Repository) pnpm rush
前端
青茶36024 分钟前
php怎么实现订单接口状态轮询请求
前端·javascript·php
鹏北海1 小时前
micro-app 微前端项目部署指南
前端·nginx·微服务
发现一只大呆瓜1 小时前
虚拟列表:从定高到动态高度的 Vue 3 & React 满分实现
前端·vue.js·react.js
css趣多多1 小时前
add组件增删改的表单处理
java·服务器·前端
证榜样呀1 小时前
2026 大专计算机专业必考证书推荐什么
大数据·前端