同步uni1 web端api示例（地图选择/查看位置）

pages.json

@@ -400,6 +400,20 @@
         "navigationBarTitleText" : "editor"
       }
     },
+    {
+      "path" : "pages/API/open-location/open-location",
+      "style" :
+      {
+        "navigationBarTitleText" : "open-location"
+      }
+    },
+    {
+      "path" : "pages/API/choose-location/choose-location",
+      "style" :
+      {
+        "navigationBarTitleText" : "choose-location"
+      }
+    },
     // #endif
     {
       "path": "pages/component/list-view/issue-2199",

pages/API/choose-location/choose-location.uvue

+<template>
+	<view>
+		<page-head :title="title"></page-head>
+		<view class="uni-padding-wrap">
+			<view style="background:#FFFFFF; padding:40rpx;">
+				<view class="uni-hello-text uni-center">当前位置信息</view>
+				<block v-if="hasLocation === false">
+					<view class="uni-h2 uni-center uni-common-mt">未选择位置</view>
+				</block>
+				<block v-if="hasLocation === true">
+					<view class="uni-hello-text uni-center" style="margin-top:10px;">
+						{{locationAddress}}
+					</view>
+					<view class="uni-h2 uni-center uni-common-mt">
+						<text>E: {{location.longitude[0]}}°{{location.longitude[1]}}′</text>
+						<text>\nN: {{location.latitude[0]}}°{{location.latitude[1]}}′</text>
+					</view>
+				</block>
+			</view>
+			<view class="uni-btn-v">
+				<button type="primary" @tap="chooseLocation">选择位置</button>
+				<button @tap="clear">清空</button>
+			</view>
+		</view>
+	</view>
+</template>
+<script lang="uts">
+	function formatLocation(longitude, latitude) {
+		if (typeof longitude === 'string' && typeof latitude === 'string') {
+			longitude = parseFloat(longitude)
+			latitude = parseFloat(latitude)
+		}
+		longitude = longitude.toFixed(2)
+		latitude = latitude.toFixed(2)
+		return {
+			longitude: longitude.toString().split('.'),
+			latitude: latitude.toString().split('.')
+		}
+	}
+	export default {
+		data() {
+			return {
+				title: 'chooseLocation',
+				hasLocation: false,
+				location: {},
+				locationAddress: ''
+			}
+		},
+		methods: {
+			chooseLocation: function () {
+				uni.chooseLocation({
+					success: (res) => {
+            console.log(res,123)
+						this.hasLocation = true,
+						this.location = formatLocation(res.longitude, res.latitude),
+						this.locationAddress = res.address
+					}
+				})
+			},
+			clear: function () {
+				this.hasLocation = false
+			}
+		}
+	}
+</script>
+
+<style>
+	.page-body-info {
+		padding-bottom: 0;
+		height: 440rpx;
+	}
+</style>

pages/API/open-location/open-location.uvue

+<template>
+	<view>
+		<page-head :title="title"></page-head>
+		<view class="uni-common-mt">
+			<form @submit="openLocation">
+				<view class="uni-list">
+					<view class="uni-list-cell">
+						<view class="uni-list-cell-left">
+							<view class="uni-label">经度</view>
+						</view>
+						<view class="uni-list-cell-db">
+							<input class="uni-input" type="text" :disabled="true" value="116.39747" name="longitude"/>
+						</view>
+					</view>
+					<view class="uni-list-cell">
+						<view class="uni-list-cell-left">
+							<view class="uni-label">纬度</view>
+						</view>
+						<view class="uni-list-cell-db">
+							<input class="uni-input" type="text" :disabled="true" value="39.9085" name="latitude"/>
+						</view>
+					</view>
+					<view class="uni-list-cell">
+						<view class="uni-list-cell-left">
+							<view class="uni-label">位置名称</view>
+						</view>
+						<view class="uni-list-cell-db">
+							<input class="uni-input" type="text" :disabled="true" value="天安门" name="name"/>
+						</view>
+					</view>
+					<view class="uni-list-cell">
+						<view class="uni-list-cell-left">
+							<view class="uni-label">详细位置</view>
+						</view>
+						<view class="uni-list-cell-db">
+							<input class="uni-input" type="text" :disabled="true" value="北京市东城区东长安街" name="address"/>
+						</view>
+					</view>
+				</view>
+				<view class="uni-padding-wrap">
+					<view class="uni-btn-v uni-common-mt">
+						<button type="primary" formType="submit">查看位置</button>
+					</view>
+				</view>
+			</form>
+		</view>
+	</view>
+</template>
+<script lang="uts">
+	export default {
+		data() {
+			return {
+				title: 'openLocation'
+			}
+		},
+		methods: {
+			openLocation: function (e) {
+				console.log(e)
+				var value = e.detail.value
+				uni.openLocation({
+					longitude: Number(value.longitude),
+					latitude: Number(value.latitude),
+					name: value.name,
+					address: value.address
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.uni-list-cell-left {
+		padding: 0 30rpx;
+	}
+</style>

pages/tabBar/API.uvue

@@ -423,15 +423,18 @@
               {
                 name: '获取当前位置',
                 url: 'get-location',
-              },
-              /* {
-                name: "使用地图查看位置",
-                url: "open-location",
-              },
-              {
-                name: "使用地图选择位置",
-                url: "choose-location",
-              },
+              },
+              // #ifdef WEB
+              {
+                name: "使用地图查看位置",
+                url: "open-location",
+              },
+              {
+                name: "使用地图选择位置",
+                url: "choose-location",
+              },
+              // #endif
+              /*
               {
                 name: "地图搜索",
                 url: "map-search",