[TOC]

sidebarDepth: 2

排名轮播表

排名轮播表同轮播表类似,也可以选择单条轮播或整页轮播。

<dv-scroll-ranking-board :config="config" style="width:500px;height:300px" />

单条滚动

<<< @/docs/guide/codeData/scrollRankingBoard/demo1.js

整页滚动

<<< @/docs/guide/codeData/scrollRankingBoard/demo2.js

数值单位

<<< @/docs/guide/codeData/scrollRankingBoard/demo3.js

数值格式化

<<< @/docs/guide/codeData/scrollRankingBoard/demo4.js

config属性

属性|说明|类型|可选值|默认值 :—:|:—:|:—:|:—:|:—: data|表数据|Array<Object>|data属性|[] rowNum|表行数|Number|—-|5 waitTime|轮播时间间隔(ms)|Number|—-|2000 carousel|轮播方式|String|'single'|'page'|'single' unit|数值单位|String|—-|'' sort|自动排序|Boolean|—-|true valueFormatter|数值格式化|Function|—-|undefined

data属性

属性|说明|类型|可选值|默认值 :—:|:—:|:—:|:—:|:—: name|名称|String|—-|—- value|数值|Number|—-|—-

valueFormatter参数属性

属性|说明|类型|可选值|默认值 :—:|:—:|:—:|:—:|:—: name|名称|String|—-|—- value|数值|Number|—-|—- percent|百分比|Number|—-|—- ranking|排名|Number|—-|—-

::: tip TIP name属性使用v-html进行渲染,因此你可以使用html标签来定制个性化的name展示效果。 :::