一、首先在nuxt.config.js文件中引入腾讯地图并加上自己的申请的key.
二、然后那个页面使用到地图的时候,就在那个页面的methods中封装初始化地图。
taps:如果多次调用和使用的话建议在data中注册map对象 ,初始值为null。
设置放置地图容器的DOM节点的id="container"
center是默认中心点坐标,也可以获取个人位置的经纬度然后设置成中心点。
zoom是地图缩放的级别。
三 、然后再mounted钩子函数中调用初始化地图的函数:
这时候都能在屏幕上看到地图了!!
四、 想要灵活更改地图的中心点的同学看这里
更改地图的中心点坐标的话,需要将当前门店的经纬度传递过来,最最重要的一点是要使用腾讯地图的setCenter的方法,因为在上方已经在页面注册了map 的实例所以可以直接使用。
item为你传递过来的经纬度信息。判断当传入的坐标为0的时候显示默认的经纬度来当前做中心点。否则地图会变成白屏哦!!!