dw php分页插件,分页 - DCloud 插件市场

更新记录

1.2.5(2020-09-09)

兼容支付宝小程序

1.2.4(2020-08-26)

修改初始化从后台拿到数据赋值失败

查看更多

使用方法

在script引用组件

import paging from '@/components/yang-paging/yang-paging.vue'

components: {

paging

}

在template中使用组件

完整示例

自定义配置

去掉上下分页 arrow:false

去掉首页最后一页 first:false

自定义圆角度

自定义颜色

:first="false" v-model="curren" @changes="dd">

点我切换总条数

跳转到第10页

import uniIcons from "@/components/uni-icons/uni-icons.vue"

import paging from '@/components/yang-paging/yang-paging.vue'

export default {

components: {

paging,

uniIcons

},

data() {

return {

total: 300,

curren: 1

}

},

methods: {

dd(index) {

this.curren = index

},

dw() {

this.total = 100

},

}

}

.title {

font-size: 14px;

line-height: 80rpx;

color: #000;

padding-left: 40rpx;

text-align: center;

}

.margin-top {

margin-top: 10px;

}

paging 属性说明

属性名

类型

默认值

详细说明

total

Number

0

总条数

pageSize

Number

0

每页数据

v-mode

Number

1

当前页

footer

Boolean

false

详细信息

background

String

#00BFFF

默认背景颜色

color

String

#ffffff

默认字体颜色

activebackground

String

linear-gradient(to right, #12c2e9, #c471ed, #f64f59)

选中背景颜色

activecolor

String

#ffffff

选中字体颜色

slot

属性名

详细说明

arrow-left

上一页内容(自定义图标文字等)

arrow-right

下一页内容(自定义图标文字等)

事件说明

事件名

说明

@changes

返回点击的页数

End