Vue加elementui实现的列表分页

Vue加elementui实现的列表分页

Vue加elementui实现的列表分页,结合了Vue及ui框架分页。

使用方法
直接下载或者在页面引入样式库文件

1
2
3
4
5
6
<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.min.js"></script>
<!-- 引入Vue -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

引入JS代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
new Vue({
            el:"#app",
methods: {
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      }
    },
    data() {
      return {
        currentPage: 1,
          currentPage1: 5,
        currentPage2: 5,
        currentPage3: 5,
        currentPage4: 4

       
      };
    }
})
当前内容只有登录了才能查看,如果您已经注册,请登录
1

发表评论