vue-app之H5打开第三方app

我不是女神ヾ 2023-02-18 14:10 20阅读 0赞

## vue-app之H5打开第三方app——打开第三方地图导航APP，并检测是否有安装，有安装该地图则跳转到该地图进行导航，如果没有则提示没有安装。 ##

运行步骤：  
1.点击导航选择应的地图

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70]  
2.选择对应的地图，判断本机是否存在该应用，有该应用则跳转导航，没有则提示本机没有该软件

[plus.runtime.isApplicationExist][] ——判断第三方程序是否已存在

onSelect(item, index) {
                // console.log(index)
                this.navgatorshow = false;
                if (!window.plus) return;
                if(index){
                    if(plus.runtime.isApplicationExist({pname:'com.autonavi.minimap'})){//判断本机是否存在该应用
                        this.Gaode()
                    }else{
                        this.$toast('请安装地图后再使用')
                    }
                }else{
                    if(plus.runtime.isApplicationExist({pname:'com.baidu.BaiduMap'})){
                        this.Baidu()
                    }else{
                        this.$toast('请安装地图后再使用')
                    }
                }
            },

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70 1]  
3.选择好对应的地图则传相对应的参数，进行导航了  
高德传参

Gaode(){
                let dlat = this.navigatorItem.lat;//终点的纬度
                let dlon = this.navigatorItem.lng;//终点的经度
                let dname = this.navigatorItem.fireUnitName;//终点的名称
                let  url = `amapuri://route/plan/?sid=BGVIS1&slat=&slon=&sname=&did=BGVIS2&dlat=${dlat}&dlon=${dlon}&dname=${dname}&dev=1&t=0`;
                plus.runtime.openURL(url)
            },

百度地图传参

Baidu(){
                let dlat = this.navigatorItem.lat;//终点的纬度
                let dlon = this.navigatorItem.lng;//终点的经度
                let dname = this.navigatorItem.fireUnitName;//终点的名称
                let url = `bdapp://map/direction?origin=&destination=name:${dname}|latlng:${dlat},${dlon}&coord_type=wgs84&mode=driving&src=andr.baidu.openAPIdemo`
                plus.runtime.openURL(url)
            }

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70 2]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200618100314398.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw==,size_16,color_FFFFFF,t_70
[plus.runtime.isApplicationExist]: http://www.html5plus.org/doc/zh_cn/runtime.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/2020061810205463.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20200618102249472.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjMwNzI4Mw==,size_16,color_FFFFFF,t_70