vue

爱躯体爱摸爱嗷

<div>
    <ul class="pagination">
        <li v-bind:class="{'disabled':pageNo==1}"><a href="javascript:void(1)" v-on:click="fanyeFn(-1)"><i class="icon-double-angle-left"></i></a></li>
        <li v-bind:class="{'active':item==pageNo}" v-for="(item,index) in page" v-bind:key="index"><a href="javascript:void(1)" v-on:click="fanyeFn(item)">{{item}}</a></li>
        <li v-bind:class="{'disabled':pageNo==page.length}"><a href="javascript:void(1)" v-on:click="fanyeFn(-2)"><i class="icon-double-angle-right"></i></a></li>
    </ul>
</div>

佳娃斯奎噗

data: {
    pageNo:1,//当前页码
    pageSize:10,//每页个数
    total:0,//总条数
    page:[],//页码表
},
methods: {
    getData(){
        ...
        this.total = msg.row_data.total_records
        var num = Math.ceil(self.total/self.pageSize)
        this.page = []
        for(var i=0;i<num;i++){
            this.page.push(i+1)
        }
    },
    fanyeFn(num){
        if(num > 0){
            this.pageNo = num
            this.getData()
        }else if(num == -1 && this.pageNo != 1){
            this.pageNo--
            this.getData()
        }else if(num == -2 && this.pageNo != this.page.length){
            this.pageNo++
            this.getData()
        }
    }
}