pointer-events不允许点击但运行滚动怎么设置，或者使用其他方法实现

如果你想禁止元素的点击事件，但允许滚动，可以使用 CSS 属性 `pointer-events:none`。但是，这将完全禁用元素的所有指针事件，包括滚动、拖拽等操作。

如果你想只禁用点击事件，但允许鼠标滚轮滚动，可以使用以下代码：

document.addEventListener('click', function(event) {
  event.preventDefault();
}, true);

document.addEventListener('wheel', function(event) {
  event.stopPropagation();
}, true);

这个代码将阻止任何点击事件，但允许鼠标滚轮滚动。注意，这里使用了 `event.stopPropagation()` 来阻止事件冒泡，以确保滚动事件不会被其他元素捕获。

另外，如果你只想禁用某个元素的点击事件，可以使用以下 CSS：

.disabled {
  pointer-events:none;
  user-select:none;
}

这个 CSS 将禁用元素的所有指针事件，并禁止用户选择元素内容。但是，这个元素仍然可以被滚动。

相关问题

vc-polyline设置了z属性也设置了pointer-events：auto点击线框内的区域也不触发点击事件

如果 `vc-polyline` 设置了 `z` 属性和 `pointer-events: auto` 样式属性，但是点击线框内的区域仍然无法触发点击事件，可能是因为 `vc-polyline` 元素的上方存在其他元素遮挡了它，导致无法响应鼠标事件。

解决这个问题的方法是，通过设置其他元素的 `pointer-events` 样式属性为 `none` 或者 `pointer-events: auto`，来控制它们是否可以响应鼠标事件。

例如，如果 `vc-polyline` 元素的上方存在一个 `div` 元素，可以将其设置为 `pointer-events: none`，使其不响应鼠标事件，例如：

<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;"></div>
<vc-polyline :path="path" :z="100" style="pointer-events: auto;"></vc-polyline>

这样就可以将 `div` 元素的 `pointer-events` 样式属性设置为 `none`，使其不响应鼠标事件，从而让 `vc-polyline` 元素可以响应鼠标事件，实现在线框区域内也可以触发点击事件的效果。

vue中使用了pointer-events: none的蒙层如何阻止点击事件穿透

在vue中，可以使用@click.stop事件修饰符来阻止点击事件穿透。具体来说，当点击事件触发时，@click.stop可以阻止事件继续向上传播，从而避免了事件穿透的问题。

例如，假设有一个蒙层元素，其样式中设置了pointer-events: none，如下所示：

<template>
  <div class="modal" style="pointer-events: none;">
    <div class="modal-dialog">
      <!-- 模态框内容 -->
    </div>
  </div>
</template>

此时，如果我们想要阻止点击事件穿透到模态框下面的元素中，可以在模态框的div元素上添加@click.stop事件修饰符，如下所示：

<template>
  <div class="modal" style="pointer-events: none;" @click.stop>
    <div class="modal-dialog">
      <!-- 模态框内容 -->
    </div>
  </div>
</template>

这样，在点击模态框元素时，@click.stop将阻止事件继续向上传播，从而避免了点击事件穿透的问题，同时也保证了模态框的正常功能。