vue引入腾讯地图

首先在src里建立TMap.js文件

export function TMap(key) {
    return new Promise(function (resolve, reject) {
        window.init = function () {
            resolve(qq);//注意
        }
        var script = document.createElemeent("script");
        script.type = "text/javascript";
        script.src="http://map.qq.com/api/js?v=2.exp&callback=init&key="+key;
        script.onerror = reject;
        document.head.appendChild(script);
    })
}

然后在map.vue里使用代码

<template>
    <div id="container">
    </div>
</template>
<script>
import { TMap } from '../TMap'
export default {
    data() {
        return {
        }
    },
    mounted() {
        TMap('申请的key').then(qq => {
            var map = new qq.maps.Map(document.getElementById("container"),{
                //地图的中心地理坐标
                center:new qq.maps.LatLng(39.916527,116.397128),zoom:8
            });
        });
    },
    methods: {
    },
    created: function () {
    }
}
</script>
<style>
#container {
    min-width:600px;
    min-height:767px;
}
</style>