Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 6005
Star 91
Fork 164
H
hello uni-app x
提交 71d8c013 编写于 作者: Anne_LXM's avatar Anne_LXM
浏览文件
操作

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

上级 de036deb
隐藏空白更改
内联 并排
Showing with 197 addition and 39 deletion
pages.json
浏览文件 @ 71d8c013
......@@ -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 0 → 100644
浏览文件 @ 71d8c013
<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 0 → 100644
浏览文件 @ 71d8c013
<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
浏览文件 @ 71d8c013
......@@ -206,13 +206,13 @@
name: 'showToast轻提示框',
url: 'toast',
api: ["showToast"]
}
// #ifdef APP
,{
name: '主题切换',
url: 'theme-change',
api: ["setAppTheme","onOsThemeChange","offOsThemeChange","onAppThemeChange","offAppThemeChange"]
}
}
// #ifdef APP
,{
name: '主题切换',
url: 'theme-change',
api: ["setAppTheme","onOsThemeChange","offOsThemeChange","onAppThemeChange","offAppThemeChange"]
}
// #endif
] as Page[],
},
......@@ -292,14 +292,14 @@
{
name: "打电话",
url: "make-phone-call",
},
{
name: "剪贴板",
url: "clipboard",
},
{
name: "监听罗盘数据",
url: "on-compass-change",
},
{
name: "剪贴板",
url: "clipboard",
},
{
name: "监听罗盘数据",
url: "on-compass-change",
},
// #endif
/*
......@@ -426,11 +426,6 @@
},
// #ifdef WEB
{
name: "地图控制",
url: "map",
},
// #endif
/* {
name: "使用地图查看位置",
url: "open-location",
},
......@@ -438,6 +433,8 @@
name: "使用地图选择位置",
url: "choose-location",
},
// #endif
/*
{
name: "地图搜索",
url: "map-search",
......@@ -503,24 +500,24 @@
url: 'facial-recognition-verify',
}
] as Page[],
},
{
id: 'ad',
name: '广告',
pages: [
{
name: '激励视频广告',
url: 'rewarded-video-ad',
}
/* {
id: "full-screen-video-ad",
url: "full-screen-video-ad",
name: "全屏视频广告",
enable: false,
pages: [] as Page[]
}, */
] as Page[],
},
},
{
id: 'ad',
name: '广告',
pages: [
{
name: '激励视频广告',
url: 'rewarded-video-ad',
}
/* {
id: "full-screen-video-ad",
url: "full-screen-video-ad",
name: "全屏视频广告",
enable: false,
pages: [] as Page[]
}, */
] as Page[],
},
// #endif
{
id: "payment",
......@@ -630,4 +627,4 @@
display: none;
background-color: rgba(16, 16, 16, 0.5);
}
</style>
</style>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或