更新记录
1.0.4(2024-01-03) 下载此版本
更新小程序显示小bug
1.0.3(2023-12-01) 下载此版本
更换为uni_modules规范组件,调用更方便
1.0.2(2023-12-01) 下载此版本
更换为uni_modules规范组件,调用更方便
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.1.0 app-vue app-nvue | √ | √ | √ | √ | √ | √ |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 | 鸿蒙元服务 |
---|---|---|---|---|
√ | √ | √ | √ | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | √ | √ | √ |
插件使用说明
特别说明
- 灵活方便,各种自定义取值。
- 灵活的动态排名,数据一目了然
参数说明
参数 | 类型 | 必填 | 说明 | 默认值 |
---|---|---|---|---|
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>