前端电商网站设计论文wordpress在线教育功能

uniapp---- 点击按钮拨打电话功能&&点击按钮调用高德地图进行导航的功能【安卓app端】

先上效果图：

1. 在封装方法的文件夹下新建一个js文件，然后把这些功能进行封装

// 点击按钮拨打电话
export function getActionSheet(phone) {uni.showActionSheet({itemList: [phone, '呼叫'],success: function(res) {console.log(res);if (res.tapIndex == 1) {uni.makePhoneCall({phoneNumber: phone,success: (res) => {console.log('调用成功!')},})}}})
}// 点击按钮进行地图导航
export function getMapAPP(lat, lng, address) {const latitude = Number(lat)const longitude = Number(lng)uni.openLocation({latitude: latitude,longitude: longitude,name: address,scale: 12,success() {console.log('打开成功!')}})
}

2.在需要的页面中进行调用

<u-icon name="phone" :color="color" size="22" @click="showActionSheet(item.tel)"></u-icon><u--image src="/static/image/frame.png" width="22" height="22" @click="toMapAPP(item.lat,item.lng,item.address+item.address_detail)"></u--image>

import {getActionSheet,getMapAPP} from '@/until/actSheet_mapAPP.js';
methods: {// 点击打电话showActionSheet(phone) {getActionSheet(phone)},//打开第三方地图toMapAPP(lat, lng, address) {getMapAPP(lat, lng, address)}
}

注意点：

1. 拨打电话需要进行app权限配置，设置完成后可以在正式版看到效果。（这几个最好都勾选上）

2. 配置高德地图的app模块设置，这里的appkey需要到高德地图网站申请。