1、在public的index.html里引入腾讯地图的js
<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=你申请的key"></script>
2、在vue页面里创建一个容器
<template> <div id="container" style="width:600px;height:500px;"></div> </template>
3、methods里建立创建地图的方法
setMap() {
//步骤:定义map变量 调用 qq.maps.Map() 构造函数 获取地图显示容器
//设置地图中心点
var myLatlng = new qq.maps.LatLng(this.latitude,this.longitude);
//定义工厂模式函数
var myOptions = {
zoom: 13, //设置地图缩放级别
center: myLatlng, //设置中心点样式
mapTypeId: qq.maps.MapTypeId.ROADMAP //设置地图样式详情参见MapType
}
// //获取dom元素添加地图信息
var map = new qq.maps.Map(document.getElementById("container"), myOptions);
}4、执行方法
mounted(){
this.setMap();
}参考:
https://www.cnblogs.com/TreeCTJ/p/13150851.html