vuejs实现本地数据的筛选分页功能思路详解(2)

<div class="main_content">
      <div class="table2_nav">
        <ul id="sublist">
          <li @click="filters(0)"><div class="blockcenter">部门分类（部门8／8）</div></li>
          <li @click="filters(1)"><div class="blockcenter">行政部</div></li>
          <li @click="filters(2)"><div class="blockcenter">报关科</div></li>
          <li @click="filters(3)"><div class="blockcenter">组装部</div></li>
          <li @click="filters(4)"><div class="blockcenter">电子部</div></li>
          <li @click="filters(5)"><div class="blockcenter">工艺部</div></li>
          <li @click="filters(6)"><div class="blockcenter">财务部</div></li>
          <li @click="filters(7)"><div class="blockcenter">制造部</div></li>
          <li @click="filters(8)"><div class="blockcenter">销售部</div></li>
        </ul>
      </div>
      <div class="table2_content">
        <div class="col-title bg-fff clearfix">
          <h5 class="fl">告警策略报表统计</h5>
          <div class="btn fl">
            主机名称 <span class="caret"></span>
            <div class="btn_down">
              <ul>
                <li>下啦</li>
                <li>下啦2</li>
              </ul>
            </div>
          </div>
          <div class="fl btn2">
            添加
          </div>
        </div>
        <table width="1410px" class="table" id="tablelist tab">
          <tr>
            <th>工号</th>
            <th>姓名</th>
            <th>部门名称</th>
            <th>性别</th>
            <th>籍贯</th>
            <th>员工状态</th>
            <th>入职时间</th>
            <th>离职时间</th>
            <th>离职类别</th>
          </tr>
          <tr v-for="subContent in yemiandata">
            <td>{{subContent.num}}</td>
            <td>{{subContent.name}}</td>
            <td>{{subContent.department}}</td>
            <td>{{subContent.sex}}</td>
            <td>{{subContent.addres}}</td>
            <td>{{subContent.staic}}</td>
            <td>{{subContent.jointime}}</td>
            <td>{{subContent.leavetime}}</td>
            <td>{{subContent.type}}</td>
          </tr>
        </table>
        <div class="vuetab clearfix">
          <ul class="fbtn clearfix" id="fbtn">
            <li @click="prevlist()"><</li>
            <!--<li @click="jemppage($event)">1</li>-->
            <li v-for="list in listnum" @click="jemppage(list)">{{list}}</li>
            <li @click="nextlist()">></li>
            <div id="pages">共{{btnnum}}页</div>
            <div id="gotoindex">到第 <input type="text" :value="jemp" v-model="jemp" id="inputnum"> 页</div>
            <button id="gobtn" @click="goindex()">确定</button>
          </ul>
        </div>
      </div>
</div>