uniapp nvue 手指缩放

<template>
	<view  @touchstart.stop="move" @touchmove.stop="moving" >
		{{ touch.scale }}
	</view>
</template>
<script>
export default {
    data() {
		  return {
             touch: {
				distanceScale: 1000, //移动500px变化100%
				scaleMax: 99, //最大缩放
				scaleMin: 1, //最小缩放
				scale: 1, //当前缩放
				scalestart: 1, //刚开始缩放的比例
				isMove: false,
				distance: 0, //俩个手指之间的距离
				startOne: { screenX: 0, screenY: 0 }, //第一个手指
				startTwo: { screenX: 0, screenY: 0 } //第二个手指
			}
		};
	},
	
	methods: {

		move(e) {
			let touches = e.changedTouches[0];
			// 第一根手指
			if (touches.identifier == 0) {
				this.touch.startOne.screenX = touches.screenX;
				this.touch.startOne.screenY = touches.screenY;
			}
			if (touches.identifier == 1) {
				this.touch.startTwo.screenX = touches.screenX;
				this.touch.startTwo.screenY = touches.screenY;
			}
			this.touch.isMove = this.touch.startOne.screenX && this.touch.startTwo.screenX;
			if (this.touch.isMove) {
				let xMove = this.touch.startOne.screenX - this.touch.startTwo.screenX;
				let yMove = this.touch.startOne.screenY - this.touch.startTwo.screenY;
				this.touch.distance = Math.sqrt(xMove * xMove + yMove * yMove);
				this.touch.scalestart = this.touch.scale;
			}
		},
		// 移动中
		moving(e) {
			if (!this.touch.isMove) return;
			let touches = e.changedTouches[0];
			// 第一根手指
			if (touches.identifier == 0) {
				this.touch.startOne.screenX = touches.screenX;
				this.touch.startOne.screenY = touches.screenY;
			}
			if (touches.identifier == 1) {
				this.touch.startTwo.screenX = touches.screenX;
				this.touch.startTwo.screenY = touches.screenY;
			}
			let xMove = this.touch.startOne.screenX - this.touch.startTwo.screenX;
			let yMove = this.touch.startOne.screenY - this.touch.startTwo.screenY;
			//双手指运动新的 ditance
			let distance = Math.sqrt(xMove * xMove + yMove * yMove);
			//计算移动的过程中实际移动了多少的距离
			let distanceDiff = distance - this.touch.distance;
			let newScale = this.touch.scalestart + (distanceDiff / this.touch.distanceScale) * (this.touch.scaleMax - this.touch.scaleMin);
			if (newScale < this.touch.scaleMin) {
				this.touch.scale = this.touch.scaleMin;
			} else if (newScale > this.touch.scaleMax) {
				this.touch.scale = this.touch.scaleMax;
			} else {
				this.touch.scale = Math.floor(newScale);
			}
			this.context.setCameraZoomRatio(this.touch.scale);
		},
		// 手指抬起
		moved(e) {
			let touches = e.changedTouches[0];
			if (touches.identifier == 0) {
				this.touch.startOne.screenX = 0;
				this.touch.startOne.screenY = 0;
			}
			if (touches.identifier == 1) {
				this.touch.startTwo.screenX = 0;
				this.touch.startTwo.screenY = 0;
			}
			this.touch.isMove = this.touch.startOne.screenX && this.touch.startTwo.screenX;
		},
     }
};
</script>
<style>

</style>