tnblog
首页
视频
资源
登录

vue-elementui分页条使用

3135人阅读 2021/11/26 12:19 总访问:572563 评论:0 收藏:0 手机
分类: 前端

code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
    <div id="app">
        <div class="block">
            <span class="demonstration">页数较少时的效果</span>
            <el-pagination layout="prev, pager, next"
                           :total="100"
                           @@current-change="handlerPage">
            </el-pagination>
        </div>
    </div>
</body>
</html>

<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    new Vue({
        el: '#app',
        methods: {
            handlerPage: function (val) {
                this.$message({
                    message: '点击分页分' + val,
                    type: 'success'
                });
            }
        },
        data: function () {
            return { visible: false }
        }
    })
</script>


欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739

评价
这一生多幸运赶上过你.
排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2024TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
欢迎加群交流技术