HbuilderX微信小程序调用地图

1、现在src目录引入腾讯地图开放文档SDK或者下面资源包

【免费】微信小程序腾讯地图资源包资源-CSDN文库

2、把下图资源包里面文件导出

 3、在下图文件中配置小程序许可

/* 小程序特有相关 */
    "mp-weixin": {
        "appid": "wxd2511dd893c162f5",
        "setting": {
            "urlCheck": false
        },
        "usingComponents": true,
        "permission": {
            "scope.userLocation": {
                "desc": "获取位置信息，给您提供更好的服务"
            }
        }, 

 4、在App.vue中引入文件并且配置方法

5、在仓库app.ts模块中定义方法

import { defineStore } from "pinia"
import { ref } from "vue"

// 定义一个store导出
export const useAppStore = defineStore("apostoreid", () => {
	const navbarHeight = ref(0);
	const city = ref("获取城市中")
	// 定义一个方法修改navbarHeight
	function changeNavBarHeight(data : number) {
		navbarHeight.value = data
	}
	// 获取城市
	function changeCity(data : string) {
		city.value = data
	}
	return { navbarHeight, changeNavBarHeight, city, changeCity }
})

6、在页面index中引入仓库并向组件传递参数

7、在组件中接受并使用

 8、在小程序看效果