vue簡單的分頁

vue分頁

<template>
    <div id='goods'>
            <button v-for='item in items' @click="c(item)"  :class = "cur == item ? 'active' : ''"> {{item}} </button>
    </div>
</template>

<script>
export default {
    name:'goods',
    data(){
        return {
            items : [1,2,3,4,5],
            cur : 2
        }
    },
    methods:{
        // 點擊事件
        c:function(page){
           // 若是當前頁和被點擊的頁面不一致，則彈出警告框
            if(page!=this.cur){
                alert(page);
            }
            // 將被點擊的頁碼賦值給當前頁
            this.cur = page;
        }
    }
    
}
</script>
<style scoped>
.active{
    color:red;
} 
</style>