Question

如何在按住鼠标单击时将布尔值设置为true，而在释放单击时将布尔值设置为false？在Vue上，我使用的是LoadBalancer，但这会切换布尔值，而不是让用户按下鼠标。

Answer 1

您需要使用事件mousedown和mouseup。尝试这样的事情：

<template>
  <div>
    <div :style="{ 'background-color': color }">
      Lorem ipsum dolor sit amet consectetur adipisicing elit.
    </div>
    <button @mousedown="color = 'orange'" @mouseup="color = 'green'" >Click here</button>
  </div>
</template>

<script>
export default {
  name: 'App',
  data: () => ({
    color: 'yellow',
  }),
};
</script>

Answer 2

同时使用mousedown和mouseup事件。

<div
  v-on:mousedown="hold = true"
  v-on:mouseup="hold = false"
>{{hold}}</div>

按住Vue事件监听器

2 个答案: