【Web前端开发】Vue+AJAX+Bootstrap-table导致失效问题

出现的问题

最近在做一个后台管理系统，需要用到分页的功能，在百度了资料后，找到了Bootstrap-table框架实现分页功能。但在实际使用中却遇到了Bug，如下：
正常显示效果应如下：

此时的JS内容如下：

<script type="text/javascript">
  new Vue({
  el: '#fresh-table',
  data: {
    infos:[
    { 
      "id":2,
      "studentName":"李四",
      "phoneNumber":"13800123439"
    },
    {
      "id":5,
      "studentName":"乔布斯",
      "phoneNumber":"13800138004"
    },
    {
      "id":6,
      "studentName":"