在子元素中禁用Vuetify v-touch

Question

我正在使用Vuetify，当用户向左或向右滑动时，我想执行一些代码。我有一个这样的容器：

<div
    v-touch="{
      left: () => next(),
      right: () => back()
    }"
  >
<!-- other html -->
</div>

问题是这个容器有另一个元素，它的文本必须水平滚动。在手机上，当我滑动滚动这个文本时，容器的v-touch指令也捕捉到了滑动，即使它不应该这样做，它也会继续。如果那个孩子被刷了，我怎么能说什么都不做呢？是否有目标参数或类似的参数？

Answer 1

您可以在要排除的元素上停止触摸事件，这样，如果事件发生在要排除的元素上或发生在元素内部，v-touch指令就不会获得这些事件。

<div
  v-touch="{
    left: () => next(),
    right: () => back()
  }"
>
  <div
    @touchstart.native.stop
    @touchmove.native.stop
    @touchend.native.stop
  >
    ...non swipable content
  </div>
  ..swipable content
</div>