微信中跳转地图app（高德地图，百度地图，腾讯地图）

<template>
	<view style="padding:0 30rpx;">
		<view class="bgc">
			<textarea class="p-20" placeholder="问题或诉求" placeholder-class="placeholder" maxlength="300" @input="submit"
				v-model="name" auto-height />
			<view class="num"><text style="color: #FB231F;">{{remnant}}</text>/300</view>
		</view>
		<button class="but_view" @click="butClick">
			去这里
		</button>

	</view>
</template>

<script>
		import wx from 'weixin-js-sdk';
	export default {
		data() {
			return {
				name: '',
				remnant: 0
			}
		},
		created() {
			
			//签名的URL
			let sign_url = "";
			if (window.__wxjs_is_wkwebview === true) {
				//如果当前设备是IOS
				sign_url = window.location.href.split("#")[0];
			} else {
				//非IOS设备
				sign_url = window.location.href;
			}
			uni.request({
				url: this.BaseUrl + "front/getWXSign", //后端接口
				method: 'POST',
				data: {
					url: encodeURI(sign_url),
				},
				header: {
					openid: uni.getStorageSync('openid'),
					'Content-Type': 'application/json',
				},
				success: (res) => {
					if (res.data.code == 200) {
						console.log("hui", res);
										wx.config({
										    debug: true, // 开启调试模式,
										    appId: res.data.data.appId, // 必填，企业号的唯一标识，此处填写企业号corpid
										    timestamp: res.data.data.timestamp, // 必填，生成签名的时间戳
										    nonceStr: res.data.data.nonceStr, // 必填，生成签名的随机串
										    signature: res.data.data.signature, // 必填，签名，见附录1
										    jsApiList: ["openLocation"], // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
										});
										jWeixin.ready(function(){
										  // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
										 this.maptext ="成功";
										 console.log("成功");
										});
										jWeixin.error(function(res){
										  // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
										  this.maptext =res;
										  console.log("失败",res);
										});
		
					}
		
				},
				fail: () => {
					uni.showToast({
						title: '获取授权信息失败',
						icon: 'none'
					});
					return false;
				}
			});
		
		},
		methods: {
			submit(e) {
				this.remnant = e.detail.value.length
			},
			butClick() {
				//去这里点击
				// 		//地点位置position.name 地点经纬度lng lat
				var lng = 39.9; //经度39.9
				var lat = 116.4; //纬度116.4
				var name = "哈喽啊"; //纬度116.4
				this.gomapApp(lat, lng, name);

			},
			// 打开的点击事件，传经纬度和地点名
			gomapApp(lat, lng, address) {
				  wx.openLocation({
				        latitude: lat, // 纬度，浮点数，范围为90 ~ -90
				        longitude: lng, // 经度，浮点数，范围为180 ~ -180。
				        name: address, // 位置名
				        address: address, // 地址详情说明
				        scale: 15, // 地图缩放级别,整型值,范围从1~28。默认为最大
				        // infoUrl: '', // 在查看位置界面底部显示的超链接,可点击跳转
				      })
			},
		}
	}
</script>

<style lang="scss">
	.bgc {
		display: flex;
		flex-direction: column;

		height: auto;
		border: 1rpx solid #F2F2F2;
		border-radius: 8rpx;
		padding: 15rpx;
		margin-top: 30rpx;
		color: #D1DCE5;
	}

	.p-20 {
		width: 100%;
		line-height: 50rpx;
		text-align: justify;
	}

	.placeholder {
		font-size: 32rpx;
		color: #C4C4C4;
	}

	.num {
		font-size: 32rpx;
		color: #aaa;
		display: flex;
		justify-content: flex-end;
	}
</style>