更新记录
1.0.4(2024-01-03) 下载此版本
更新小程序显示小bug
1.0.3(2023-12-01) 下载此版本
更换为uni_modules规范组件,调用更方便
1.0.2(2023-12-01) 下载此版本
更换为uni_modules规范组件,调用更方便
查看更多平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | - | √ | √ | √ | √ |
其他
多语言 | 暗黑模式 | 宽屏模式 |
---|---|---|
× | × | √ |
插件使用说明
特别说明
- 灵活方便,各种自定义取值。
- 灵活的动态排名,数据一目了然
参数说明
参数 | 类型 | 必填 | 说明 | 默认值 |
---|---|---|---|---|
data | Array | 是 | 数据来源 | - |
color | String | 否 | 排名颜色条显示色 | #409EFF(蓝色) |
max | String / Number | 否 | 排名进度的最大值,即 100% | - |
min | String / Number | 否 | 排名进度的最小值,即 0% | - |
model | String | 否 | none:不展示名称 left:名字在左侧 top:名字在上侧 |
none |
keyname | String | 否 | 排名显示的名称键值,如果没有传该参数或未找到该键值,model强制为none | - |
keyvalue | String | 否 | 排名显示值的键值,如果没有传该参数,自动寻找第一个符合条件的字段或为0。 | - |
voluntarily | Boolean | 否 | 是否自动排名 | true |
使用示例
<template>
<view>
<pc-sortlist :data="data" keyname="name" keyvalue="value" model="top"></pc-sortlist>
</view>
</template>
<script>
export default {
data() {
return {
data:[{name:'张三',value:100},{name:'李四',value:80},{name:'王二',value:50},{name:'麻子',value:200}]
}
},
}
</script>