uniapp——定位(查看地图)

一、简介

点击定位图片可查看地图(显示的地址是提前预设好的)
在这里插入图片描述
注意:使用微信开发者工具打开,H5报错: [system] Map key not configured。原因:H5 端使用地图和定位相关,需要配置腾讯或谷歌等三方地图服务商申请的秘钥。

二、代码

<template>
	<view class="content">
		<image src="../../static/images/address.png" mode="aspectFill" class="address" @click="location">image>
	view>
template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad() {

		},
		methods: {
			// 查看定位
			location() {
				uni.openLocation({
					// latitude: parseFloat(this.details.lat),
					// longitude: parseFloat(this.details.lon),
					// 上海东方明珠的定位
					latitude: 31.245549,//纬度
					longitude:121.506375,//经度
					address: "地址:XXXX",
					name: "景点名称"
				});
			}
		}
	}
script>

<style lang="scss">
	.address {
		width: 80rpx;
		height: 80rpx;
	}
style>

三、其他

参考网址:
https://uniapp.dcloud.net.cn/api/location/open-location.html#openlocation

你可能感兴趣的:(uni,vue,微信小程序,uni-app,前端,javascript)