百度地图pc端

1.申请ak秘钥

2.安装

npm install vue-baidu-map --save

3.全局注册

import BaiduMap from 'vue-baidu-map';

Vue.use(BaiduMap, {
  ak: '你的秘钥'
})

4.在页面中使用

<!-- 上传 -->
<template>
    <div style="width:400px;height:400px">
//创建容器
        <baidu-map :center="center" :zoom="zoom" @ready="handler" style="width:400px;height:400px"></baidu-map>
    </div>

</template>

<script>

import ChinaMap from "./custom_map_config.json";
export default {
    name: 'Test1Test',
    watch: {

    },
    data() {

        return {
            center: { lng: 0, lat: 0 },
            zoom: 3
        };
    },

    mounted() {

    },
    computed: {

    },

    methods: {
        handler({ BMap, map }) {
            console.log(BMap, map)
            this.center.lng = 116.404
            this.center.lat = 39.915
            this.zoom = 15
        }
    }

};
</script>

<style scoped lang="scss">
</style>