15 changed files with 184 additions and 26 deletions
@ -0,0 +1,81 @@ |
|||
<template> |
|||
<div class="footer" v-if="mobileModel!=='Phone'"> |
|||
<div class="flex flex-x flex-end " style="width: 150px;"> |
|||
<van-icon name="arrow-left" @click="goToPreviousPage()"/> |
|||
<!-- <div class="" @click="goToPreviousPage()"><</div> --> |
|||
<!-- <div class="AAA" @click="goToNextPage()">></div> --> |
|||
<van-icon name="arrow" @click="goToNextPage()" /> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
export default { |
|||
name: 'Android', |
|||
|
|||
data() { |
|||
return { |
|||
mobileModel:null |
|||
} |
|||
}, |
|||
props: { |
|||
|
|||
}, |
|||
watch: { |
|||
|
|||
}, |
|||
mounted() { |
|||
this.getMobileModel() |
|||
}, |
|||
methods: { |
|||
goToPreviousPage() { |
|||
history.back(); |
|||
}, |
|||
goToNextPage() { |
|||
history.forward(); |
|||
}, |
|||
getMobileModel() { |
|||
var userAgent = navigator.userAgent || navigator.vendor || window.opera; |
|||
// 使用正则表达式匹配常见的移动设备型号 |
|||
var androidMatch = userAgent.match(/Android\s([0-9\.]+)[\s\/;]*[^\s]+/i); |
|||
var iosMatch = userAgent.match(/\((iPhone|iPad|iPod)[^;]+;[\s\S]+?OS\s([0-9_]+)/i); |
|||
this.mobileModel = "未知设备"; |
|||
if (androidMatch) { |
|||
this.mobileModel = "Android " + androidMatch[1]; |
|||
} else if (iosMatch) { |
|||
mobileModel = iosMatch[1] + " iOS " + iosMatch[2].replace(/_/g, '.'); |
|||
} else { |
|||
// 可以根据需要添加更多的匹配规则来识别更多设备 |
|||
var otherMatch = userAgent.match(/(Mobile|Tablet|Phone)/i); |
|||
if (otherMatch) { |
|||
this.mobileModel = otherMatch[0]; |
|||
} |
|||
} |
|||
console.log("用户的手机型号是:" + this.mobileModel); |
|||
this.$emit('send-number', this.mobileModel) |
|||
return this.mobileModel; |
|||
|
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="less"> |
|||
.footer{ |
|||
background-color: white; |
|||
width: 375px; |
|||
height: 8vh; |
|||
display: flex; |
|||
position: fixed; |
|||
bottom: 0; |
|||
text-align: center; |
|||
align-items: center; |
|||
justify-content: center; |
|||
font-size: 25px; |
|||
|
|||
} |
|||
</style> |
|||
|
Loading…
Reference in new issue