利用Vue怎么编写一个摇一摇功能?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。
<van-popup v-model="isTip" class="popInfo" :close-on-click-overlay="false"> <div class="mainBody"> <h4 class="systemTip">温馨提示</h4> <div class="confirm"> 由于ios系统需要手动获取访问动作与方向的权限,为保障游戏的正常进行,请在访问提示中点击允许。 </div> </div> <button class="bottomButton" @click="handleInit"> 知道了 </button> </van-popup>
shake.js
//引入shake.js created(){ this.initShake() const isAction = JSON.parse(localStorage.getItem('getAction')) var ua = navigator.userAgent.toLowerCase(); if(ua.indexOf("like mac os x") > 0){ var reg = /os [\d._]*/gi ; var verinfo = ua.match(reg) ; var version = (verinfo+"").replace(/[^0-9|_.]/ig,"").replace(/_/ig,"."); if (parseFloat(version) >= 13.3 && !isAction){ localStorage.setItem("getAction",true) this.isTip = true } } }, methods:{ initShake(){ this.myShakeEvent = new Shake({ threshold: 15, // 摇动阈值 timeout: 1000 // 事件发生频率,是可选值 }); this.myShakeEvent.start(); window.addEventListener('shake', xx); }, handleInit(){ this.isTip = false this.ios13granted() }, ios13granted() { if (typeof DeviceMotionEvent.requestPermission === 'function') { DeviceMotionEvent.requestPermission().then(permissionState => { if (permissionState === 'granted') { this.initShake() //摇一摇 } else if(permissionState === 'denied'){// 打开的链接不是https开头 alert("当前IOS系统拒绝访问动作与方向。请退出微信,重新进入活动页面获取权限。或直接点击抽签桶参与活动") } }).catch((error) => { alert("请求设备方向或动作访问需要用户手势来提示") }) } else { // 处理常规的非iOS 13+设备 alert("处理常规的非iOS 13+设备") } }, }
关于利用Vue怎么编写一个摇一摇功能问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注亿速云行业资讯频道了解更多相关知识。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。