vue.js中H5使用微信摇一摇抽奖,判断摇一摇次数

微信摇一摇抽奖:

export default {
		data() {
			return {
				SHAKE_THRESHOLD:4000,//定义一个摇动的值
				last_update :0,//定义一个变量保存上次更新的时间
				x:0, //定义xyz记录三个轴的数据以及上一次出发的时间
				y:0, 
				z:0,
				last_x :0,
				last_y :0, 
				last_z :0,
				count:0,//次数
			}
		},
		methods: {
			luckDraw() {
				//抽奖函数
			},
			deviceMotionHandler(eventData) {
				 let acceleration =eventData.accelerationIncludingGravity;//含重力加速度
				 let curTime = new Date().getTime();//获取当前时间
				if ((curTime-this.last_update)> 10) {//curTime - last_update 是固定时间段
					let diffTime = curTime -this.last_update;
					 this.last_update = curTime;
					 this.x = acceleration.x;
					 this.y = acceleration.y;
					 this.z = acceleration.z;
					 let speed = Math.abs(this.x +this.y + this.z - this.last_x - this.last_y - this.last_z) / diffTime * 10000;
					 if (speed > this.SHAKE_THRESHOLD) {
						 this.count++;//次数自增1
						 if(this.count > 1){
						 	return false;
						 }else{
							this.luckDraw();//抽奖
						 }
					 }
					 this.last_x = this.x;
					 this.last_y = this.y;
					 this.last_z = this.z;
				 }
			}
		},
		mounted() {
			const _this = this;
	
			if (window.DeviceMotionEvent) {
				window.addEventListener('devicemotion',_this.deviceMotionHandler,false);
			}
		},
                beforeDestroy(){
			window.removeEventListener('devicemotion',function () {}, false);
			this.count = 2;
		}
	}
发布了94 篇原创文章 · 获赞 42 · 访问量 13万+

猜你喜欢

转载自blog.csdn.net/qq_29483485/article/details/88865930