vue中h5端打开app（判断是安卓还是苹果）
1.开发环境 vue+vant
2.电脑系统 windows10专业版
3.在h5端开发的过程中，我们经常需要点击⼀个按钮来判断⽤户使⽤安装了app(⾸先判断是安卓还是苹果，然后判断是否安装了app，如果没有安装则跳转到下载页⾯，如果安装了则打开)。
4.废话不多说，直接上代码:
<div class="xiding-r" @click="openapp">
Open APP
</div>
5.在methods中添加如下代码:
openapp() {
var u = navigator.userAgent,
app = navigator.appVersion;
var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if (isAndroid) {
// alert("我是安卓");
this.android();
}
if (isIOS) {
// alert("我是苹果");
}
},
android() {
var _clickTime = new Date().getTime();
window.location.href = 'zhihu://'; /***打开app的协议，有安卓同事提供***/
//启动间隔20ms运⾏的定时器，并检测累计消耗时间是否超过3000ms，超过则结束
var _count = 0, intHandle;
intHandle = setInterval(function () {
_count++;
var elsTime = new Date().getTime() - _clickTime;
if (_count >= 100 || elsTime > 5000) {
console.log(_count)
console.log(elsTime)
clearInterval(intHandle);
//检查app是否打开
if (document.hidden || document.webkitHidden) {
// 打开了
window.location.href = "zhihu://";
// alert('打开了');
window.close();
// return;
} else {
安卓下载app
// 没打开
// alert('没打开');
window.location.href = "";//下载链接
}
}
}, 20);
},
5.注意：在这个案例中我是⽤的知乎的例⼦:
6.注意
到此这篇关于vue中h5端打开app(判断是安卓还是苹果)的⽂章就介绍到这了，更多相关vue中h5端打开app 内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！