uniapp 父元素@touchmove 在小程序无效，子元素是scroll-view 标签怎么解决？

在 UniApp 中，当父元素绑定 @touchmove 事件而子元素是 scroll-view 时，@touchmove 可能无法触发，这是因为 scroll-view 组件默认会阻止父级元素的触摸事件冒泡。以下是解决方案：

1. 在 scroll-view 上添加 @touchmove 事件

将 @touchmove 事件绑定到 scroll-view 子元素上，而不是父元素。这样事件会在 scroll-view 内部触发。

示例代码：

<template>
  <view class="parent">
    <scroll-view 
      scroll-y 
      @touchmove="handleTouchMove"
      style="height: 300px;">
      <!-- 子元素内容 -->
      <view v-for="item in list" :key="item">{{ item }}</view>
    </scroll-view>
  </view>
</template>

<script>
export default {
  methods: {
    handleTouchMove(event) {
      console.log('Touch move event:', event);
      // 在这里处理触摸移动逻辑
    }
  }
}
</script>

2. 使用 catchtouchmove 替代 @touchmove

在小程序环境中，使用 catchtouchmove 可以捕获事件并阻止冒泡，确保事件在 scroll-view 内触发。

示例代码：

<scroll-view 
  scroll-y 
  catchtouchmove="handleTouchMove"
  style="height: 300px;">
  <!-- 子元素内容 -->
</scroll-view>

3. 在 scroll-view 上设置 disable-default-scroll 属性（可选）

如果不需要 scroll-view 的默认滚动行为，可以添加 disable-default-scroll 属性，并完全通过自定义事件控制滚动。

示例代码：

<scroll-view 
  scroll-y 
  disable-default-scroll 
  @touchmove="handleTouchMove"
  style="height: 300px;">
  <!-- 子元素内容 -->
</scroll-view>

注意事项：

• 如果父元素仍需处理触摸事件，考虑将逻辑移至 scroll-view 的事件中。
• 测试时确保事件处理函数不会影响 scroll-view 的正常滚动。

通过以上方法，可以解决父元素 @touchmove 在 scroll-view 子元素下无效的问题。