更新记录
1.0.2(2023-05-08) 下载此版本
组件优化
1.0.1(2023-05-08) 下载此版本
组件优化
1.0.0(2023-05-08) 下载此版本
muyu-dragMod发布
查看更多平台兼容性
uni-app
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| - | √ | - | - | √ | - | - | - | - |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|
| - | - | - | - | - | - | - | - | - | - | - |
其他
| 多语言 | 暗黑模式 | 宽屏模式 |
|---|---|---|
| × | × | √ |
muyu-dragMod
简介
实现自定义组件拖动排序,支持h5和app
使用说明
组件示例
<muyu-dragMod-example :modList="list" @dragmodmits="dragmodmits">
<template #[getList(0)]>
<view class="item">
<!-- 自定义组件插槽-->
</view>
</template>
<template #[getList(1)]>
<view class="item">
<!-- 自定义组件插槽-->
</view>
</template>
<template #[getList(2)]>
<view class="item">
<!-- 自定义组件插槽-->
</view>
</template>
</muyu-dragMod-example>
API
参数
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| modList | Array | - | 自定义组件列表,详情参考js示例。注意:name必须唯一,order必须按照升序,从0开始 |
事件
| 事件名 | 事件说明 | 返回参数 |
|---|---|---|
| @dragmodmits | 参数回调方法 | - |
js示例
export default {
data() {
return {
list:[
{name:'00',order:0},
{name:'01',order:1},
{name:'02',order:2},
],
}
},
methods: {
dragmodmits(e){
console.log(e)
},
getList(e){
return this.list[e].name
}
},
}

收藏人数:
下载插件并导入HBuilderX
下载示例项目ZIP
赞赏(0)
下载 1167
赞赏 0
下载 11032301
赞赏 1800
赞赏
京公网安备:11010802035340号