uni-app 实现循环一组在一行的button ，button可以左右滑动

可以使用 uni-app 中的 swiper 组件来实现这个需求。

首先，你需要将需要循环的 button 放入 swiper-item 内，然后设置 swiper 组件的属性：

1. 设置 direction 为 horizontal，表示滑动方向为横向；
2. 设置 loop 属性为 true，表示循环滑动；
3. 设置 swiper-item 的宽度为固定值或百分比值，以适应不同屏幕大小；

下面是一个示例代码：

<template>
  <view>
    <swiper direction="horizontal" loop>
      <swiper-item>
        <view class="button-container">
          <button class="button-item">Button 1</button>
          <button class="button-item">Button 2</button>
          <button class="button-item">Button 3</button>
          <button class="button-item">Button 4</button>
          <button class="button-item">Button 5</button>
        </view>
      </swiper-item>
      <swiper-item>
        <view class="button-container">
          <button class="button-item">Button 6</button>
          <button class="button-item">Button 7</button>
          <button class="button-item">Button 8</button>
          <button class="button-item">Button 9</button>
          <button class="button-item">Button 10</button>
        </view>
      </swiper-item>
    </swiper>
  </view>
</template>

<style scoped>
  .button-container {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: scroll;
  }

  .button-item {
    width: 100px;
    height: 40px;
    margin-right: 10px;
    background-color: #ccc;
    color: #fff;
    border: none;
    border-radius: 5px;
  }
</style>

在样式中，我们将 button 放入一个 flex 容器中，设置 flex-wrap 为 nowrap，表示不换行，然后设置 overflow-x 为 scroll，表示横向滑动。

最后，我们设置 button-item 的宽度为 100px，高度为 40px，设置 margin-right 为 10px，以便在 button 之间留有间距。