更新记录

1.0.0（2025-07-04） 下载此版本

新增组件

平台兼容性

uni-app(4.05)

其他

w-drag-sort

基于vue2开发，微信小程序、H5 mobile、app-vue测试完美运行，其他未测

使用方法

配置easycom规则后，自动按需引入，无需import组件，直接引用即可。
如果只想把组件放到分包里，可以组件内的components复制到对应分分包目录，然后引入组件使用。

示例代码

<template>
  <view class="page">
    <view class="sort-box">
      <w-drag-sorts :listData="listData" @draged="ed" :itemStyles="{'border-bottom':'1px #eee solid'}" :itemHeight="100" @itemIconClick="onItemIconClick"/>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        listData: [{
            icon: '/static/images/苹果.png', //不传该属性，则不显示也不占位
            text: '1.苹果'
          },
          {
            icon: '/static/images/雪梨.png',
            text: '2.雪梨'
          },
          {
            icon: '/static/images/橙子.png',
            text: '3.橙子'
          },
          {
            icon: '/static/images/香蕉.png',
            text: '4.香蕉'
          },
        ]
      }
    },
    methods: {
      ed(v) {
        console.log(v)
      },

      onItemIconClick(index,item){
        console.log(index, item)
      },
    }
  }
</script>
<style scoped lang="scss">
  .page {
    background: #efefef;
    height: 100vh;
    overflow: hidden;

    .sort-box {
      width: 90%;
      margin: 30px auto 0 auto;
    }
  }
</style>

组件属性

组件事件

listData