1 2 3 4 // 地址 const map_address = ref(''); // 地图类型 const map_type = ref('tianditu'); 组件回调: 1 2 3 4 5 //地图用于回调用于获取坐标 const map_point = (lng: number, lat: number) => { form.lng = lng; form.lat = lat; }; 地图效果展示: 分类: vue3 标签: 吃...
在项目根目录创建文件 vue.config.js ,注意配置文件最好别用 ts,在 js 文件中粘贴以下代码: module.exports = { configureWebpack: { externals: { 'AMap': 'AMap' // 表示 CDN 引入的高德地图 } } } 新建vue 文件,粘贴以下 css 代码和结构。 ps:css 代码是搜索框的样式,高德地图也有自带。 <template...
简介: vue3使用高德地图实现点击获取经纬度以及搜索功能 话不多说直接上干活 在此之前你需要有高德地图的key,这个自己去申请即可 1,首先需要在终端安装 npm i @amap/amap-jsapi-loader --save 2,准备一个容器 <template> </template> #container{ padding:0px; margin: 0px; width: 100%; height: 800...
第二步:在 vue3 项目中使用高德地图 api 复制刚刚创建好的 key。 在pulic/index.html 通过 CDN 引入高德地图 api。 ps:CDN 在这里的意指通过链接加载的某些组件库,而不是通过 npm,组件通过 CDN 加载可以启到一定程度的加速效果。 在项目根目录创建文件 vue.config.js ,注意配置文件最好别用 ts,在 js ...
第二步:在vue3项目中使用高德地图api 复制刚刚创建好的key 在pulic/index.html通过CDN引入高德地图api ps:CDN在这里的意指通过链接加载的某些组件库,而不是通过npm,组件通过CDN加载可以启到一定程度的加速效果 在项目根目录创建文件vue.config.js,注意配置文件最好别用ts,在js文件中粘贴以下代码 module.exports=...