Three.js || 优化 || 旋转不触发点击

• 功能：左键按下并拖拽可旋转模型；左键点击可查看媒体资源
• bug：旋转后会触发查看事件
• 接手代码：mouseup监听绑定点击事件，并触发查看事件onView

优化思路一：新增mousedown监听，设置定时器，落下300秒后值为真；抬起值为假。（则长按旋转时值为假，点击时值为真。）

// 绑定mousedown
setDownTime()
{
	setTimeout(() =>
	{
		this.downUpTime = true
	}, 300)
},
// 绑定mouseup
onUpdateRay()
{
	this.downUpTime = false
	setTimeout(() =>// 我这里的代码逻辑需要缓冲300秒，具体情况具体分析
	{
		'''原代码'''
		if (this.downUpTime)
			this.onView()// 查看事件
	}, 300)
}

优化思路二：新增mousedown监听，计算左键落下与抬起时间差，小于阈值才触发查看事件

// 绑定mousedown
setDownTime()
{
	this.downUpTime = Date.now()
},
// 绑定mouseup
onUpdateRay()
{
	'''原代码'''
	if (Date.now() - this.downUpTime < 300)
		this.onView()// 查看事件
}

优化思路三：新增mousedown监听，计算左键落下和抬起位置差，完全相等才触发查看事件

// 绑定mousedown
setDownTime()
{
	this.x = (event.clientX / window.innerWidth) * 2 - 1
    this.y = -(event.clientY / window.innerHeight) * 2 + 1
},
// 绑定mouseup
onUpdateRay()
{
	'''原代码'''
    let x = (event.clientX / window.innerWidth) * 2 - 1
    let y = -(event.clientY / window.innerHeight) * 2 + 1
	if (x === this.x && y === this.y)
		this.onView()// 查看事件

目前采用的是思路三，怕有的人点击快，有的人点击慢，300ms的阈值不普适。