问题回顾：

每次进入该页面的时候，上拉到最后就会出现这样的问题（如图）：

底部都没有数据了，但是依然可以滑动，百思不得其解。但是点击tags标签后，就回复正常。

代码分析：

1.html

<!-- 我的问题（已解答，未解答） -->
<template>
  <div class="myQuestion">
    <topnav :title="title"></topnav>
    <div class="question-menu">
      <div class="item" :class="[activeShow === 4?'active':'']" @click="menuClick(4)">未解答</div>
      <div class="item" :class="[activeShow === 3?'active':'']" @click="menuClick(3)">已解答</div>
    </div>
    <div class="qaBox" ref="myquestionbox">
      <!-- 已解答 -->
      <div class="question-answer question-item" v-if="activeShow === 3">
        <div class="list">
          ...
        </div>
      </div>
      <!-- 未解答 -->
      <div class="question-notAnswer question-item" v-if="activeShow !== 3">
        <div class="list">
          ...
        </div>
      </div>
      <div class="upload loadItem" v-if="upload">正在刷新<img src="static/img/loading.gif"></div>
      <div class="addload loadItem" v-if="addload">正在加载<img src="static/img/loading.gif"></div>
    </div>
  </div>
</template>

less：

  .myQuestion { overflow: hidden; width: 100%;   background-color: #fff; padding-top: 100px;
    .question-menu{...}
    .qaBox{ position: absolute; left: 0; top: 188px; right: 0; bottom: 0; overflow: hidden}
    .question-item{ overflow: hidden; width: 100%;}
    .question-answer{
      .list{ overflow: hidden; width: 100%; padding: 30px; box-sizing: border-box;
        ...
      }
    }
    .question-notAnswer{ overflow: hidden; width: 100%;
      .list{ overflow: hidden; padding: 30px; padding-bottom: 100px;
        ...
        }
      }
    }
  }

js代码经排查正常，所以问题应该出现在html和less代码中。

经过一系列的测试排查后，发现问题出现在less代码的第一行，即最外层div class='myQuestion'上面，即代码

.myQuestion { overflow: hidden; width: 100%;   background-color: #fff; padding-top: 100px;}

解决办法：给这个类添加以下代码

.myQuestion { overflow: hidden; width: 100%;   background-color: #fff; padding-top: 100px; position: fixed; left: 0; top: 0; right:0; bottom: 0;}

解决！

结论：在使用better-scroll滚动页面的时候，组件最外层的div需要固定屏幕的宽高，否则会出现滑动超出。