uni-app uni-swipe-action 滑动组件小程序存在同时滑动多个的Bug

直接导入示例项目示例项目测试是否正常呢？

在 uni-app 中使用 uni-swipe-action 组件时，确实可能会遇到同时滑动多个项目的Bug。这通常是由于事件处理不当或组件内部状态管理问题导致的。为了解决这个问题，我们可以通过精细控制触摸事件和组件状态来尝试修复。

以下是一个简化的代码示例，展示了如何通过监听触摸事件来单独控制每个 uni-swipe-action 项，从而避免同时滑动多个的问题。请注意，这只是一个示例，实际应用中可能需要根据具体情况进行调整。

<template>
  <view class="container">
    <block v-for="(item, index) in items" :key="index">
      <uni-swipe-action :auto-close="true" @touchstart="handleTouchStart(index)" @touchmove="handleTouchMove(index)" @touchend="handleTouchEnd(index)">
        <view class="swipe-item">
          {{ item.name }}
          <uni-swipe-action-button text="操作" background-color="#1aad19" />
        </view>
      </uni-swipe-action>
    </block>
  </view>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { name: 'Item 1' },
        { name: 'Item 2' },
        { name: 'Item 3' },
        // 更多项目...
      ],
      activeIndex: null, // 当前正在滑动的项索引
    };
  },
  methods: {
    handleTouchStart(index) {
      this.activeIndex = index; // 记录开始滑动的项索引
    },
    handleTouchMove(index) {
      if (this.activeIndex !== index) {
        // 如果当前触摸的不是正在滑动的项，则阻止默认行为（这里需要具体实现阻止逻辑，可能是通过CSS或JS）
        return false;
      }
      // 处理滑动逻辑
    },
    handleTouchEnd(index) {
      if (this.activeIndex === index) {
        // 处理滑动结束逻辑，如关闭操作按钮
        this.activeIndex = null; // 重置活动索引
      }
    },
  },
};
</script>

<style scoped>
.container {
  display: flex;
  flex-direction: column;
}
.swipe-item {
  padding: 20px;
  background-color: #fff;
  margin-bottom: 10px;
  border: 1px solid #ddd;
}
</style>

在这个示例中，我们通过 activeIndex 来跟踪当前正在滑动的项。在 handleTouchStart 方法中记录开始滑动的项索引，在 handleTouchMove 方法中检查当前触摸的项是否与正在滑动的项匹配，如果不匹配则阻止默认行为（具体实现可能需要根据 uni-swipe-action 的内部机制进行调整）。在 handleTouchEnd 方法中处理滑动结束的逻辑，并重置 activeIndex。

请注意，由于 uni-swipe-action 的内部实现细节可能不同，上述方法可能需要根据实际情况进行调整。如果问题依然存在，建议查阅 uni-app 和 uni-swipe-action 的官方文档或社区，以获取更具体的解决方案。