Vuetify Vue - 始终监听滑动事件，但只返回一次值

Question

我为该项目安装了 vuetify 插件，以便使用 colorpicker 插件。由于特殊需求，我需要手动更改插件的功能和风格。该插件有一个滚动条，每次滑动按钮时，它都会返回当前颜色的十六进制值。现在我需要使其可滑动，但仅在松开时返回当前颜色值。我应该怎么办？以下是监听滚动事件的方法  if ('touches' in e) {    this.app.addEventListener('touchmove', this.onMouseMove, mouseMoveOptions);//滑动    Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["addOnceEventListener"])(this.app, 'touchend', this.onSliderMouseUp, mouseUpOptions);  } else {    this.app.addEventListener('mousemove', this.onMouseMove, mouseMoveOptions);    Object(_util_helpers__WEBPACK_IMPORTED_MODULE_6__["addOnceEventListener"])(this.app, 'mouseup', this.onSliderMouseUp, mouseUpOptions);  }//addEventListener is a custom function,listener event just once.当滑块移动时 onMouseMove: function onMouseMove(e) {      var value = this.parseMouseMove(e).value;      this.internalValue = value;    },parseMouseMove: function parseMouseMove(e) {  var start = this.vertical ? 'top' : 'left';  var length = this.vertical ? 'height' : 'width';  var click = this.vertical ? 'clientY' : 'clientX';  var _a = this.$refs.track.getBoundingClientRect(),      _b = start,      trackStart = _a[_b],      _c = length,      trackLength = _a[_c];  var clickOffset = 'touches' in e ? e.touches[0][click] : e[click]; // Can we get rid of any here?  // It is possible for left to be NaN, force to number  var clickPos = Math.min(Math.max((clickOffset - trackStart) / trackLength, 0), 1) || 0;  if (this.vertical) clickPos = 1 - clickPos;  if (this.$vuetify.rtl) clickPos = 1 - clickPos;  var isInsideTrack = clickOffset >= trackStart && clickOffset <= trackStart + trackLength;  var value = parseFloat(this.min) + clickPos * (this.maxValue - this.minValue);  return {    value: value,    isInsideTrack: isInsideTrack  };},

Answer 1

addEventListener如果您使用 Vue.js，我可以建议您在您的<template>部分使用 Vue.js '事件处理'，而不是, ，例如：

<div

  @mousedown="moveStartMethod($event)"

  @mousemove.prevent="moveMotionMethod"

  @mouseup="moveEndMethod"

>

</div>

然后在你的<script>部分，你可以调用这些方法：

moveStartMethod: function (event) {

  ...

}