微信小程序调用腾讯地图选点 地图选择获取位置

业务:

小程序中实现选择地址

解决方案:

1.在小程序后台的设置>第三方设置>在插件管理中添加插件搜索>腾讯位置服务地图选点

2.插件引入后可以点击详情查看文档

(1)首先在app.json中添加插件

//app.json

"plugins":{
            "chooseLocation":{
                "version":"1.0.9",
                "provider":"wx76a9a06e5b4e693e"//按照文档的原样复制,非自己小程序的appId
            }
        },

(2)

//app.json

{
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序定位"
    }
  }
}

在uniapp中开发可以放在manifest.json的源码视图编写:

"mp-weixin" : {

        "plugins":{
            "chooseLocation":{
                "version":"1.0.9",
                "provider":"wx76a9a06e5b4e693e"
            }
        },

        "permission" : {
            "scope.userLocation" : {
                "desc" : "你的位置信息将用于小程序位置接口的效果展示"
            }
        },

}

3.在页面中使用

<script>
    const chooseLocation = requirePlugin('chooseLocation');
    export default {
	    data(){
		    return{
			    latitude:'',
			    longitude:''
		    }
	    }, 
        onShow(){
            const resAddress=chooseLocation.getLocation();//地图选点后返回当前页面通过这种方式将内容取出
            if(resAddress){
				this.jobCity= resAddress.name;			  
                this.findPostBasicInfoVos({lat:resAddress.latitude,
                                lng:resAddress.longitude}); 
			} 
        },
        onHide(){
            //有些业务场景当离开页面后将原本存在插件中位置信息清空
            chooseLocation.setLocation(null);
        },
        methods:{
		    showMap(){  
			    const key = ''; //使用在腾讯位置服务申请的key,申请地址https://lbs.qq.com/
			    const referer = '小程序的名称'; //调用插件的app的名称
			    const location = JSON.stringify({
			      latitude: this.latitude,
			      longitude: this.longitude
			    });
			    const category = '生活服务'; 
			    wx.navigateTo({
			      url: `plugin://chooseLocation/index?key=${key}&referer=${referer}&location=${location}&category=${category}`
			    });
		    }
	    }
    }
</script>

 注意

1.如果报t is not function

使用小程序插件报错t is not function_路光.的博客-CSDN博客

2.还需要在app.json中配置

"requiredPrivateInfos":[
	"getLocation",
	"chooseLocation"
]

  • 1
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

路光.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值