;
  <腳本>
    var newlist = 新 Vue({
      el: '#app',
      數(shù)據(jù)： {
        current_page: 1, //當(dāng)前頁
        頁數(shù): 50, //總頁數(shù)
        changePage:'',//跳轉(zhuǎn)頁
        現(xiàn)在索引:0
      },
      計(jì)算：{
         顯示：函數(shù)（）{
             返回 this.pages && this.pages !=1
         },
         pstart: 函數(shù)() {
           返回 this.current_page == 1;
         },
         掛起：函數(shù)（）{
           返回 this.current_page == this.pages;
         },
         efont: 函數(shù)() {
           if (this.pages <= 7) 回傳 false;
           返回 this.current_page > 5
         },
         後面：函數(shù)（）{
           if (this.pages <= 7) 回傳 false;
           var nowAy = this.indexs;
           return nowAy[nowAy.length - 1] != this.pages;
         },
         索引：函數(shù)() {

           左變數(shù) = 1,
             右 = this.pages,
             ar = [];
           if (this.pages >= 7) {
             if (this.current_page > 5 && this.current_page < this.pages - 4) {
               左 = Number(this.current_page) - 3;
               右 = Number(this.current_page) + 3;
             } 別的 {
               if (this.current_page <= 5) {
                 左=1；
                 右 = 7；
               } 別的 {
                 右 = this.pages;

                 左 = this.pages - 6;
               }
             }
           }
           而（左 <= 右）{
             ar.push(左);
             左++；
           }
           返回 ar；
         },
       },
      方法： {
        跳轉(zhuǎn)頁面：函數(shù)（id）{
          this.current_page = id;
        },
      },

    })
  </劇本>

前一篇有跳轉(zhuǎn)功能的vue.js分頁外掛程式碼，功能齊全的vue分頁元件，vue.js使用計(jì)算屬性，資料同步執(zhí)行對應(yīng)的函數(shù)分頁代碼。