我們經常會遇見列表;
但是今天卻發現下拉的時候；
無法觸發onReachBottom事件;
原來是因為列表內容嵌套出現問題；
導致onReachBottom事件無法被觸發

記住：列表內容如果是元件；外層不需要再包裹一層

錯誤的巢狀， 元件外層巢狀導致無法觸發onReachBottom事件;

<view class="list-cont">
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
  <list-room @click="gotode"></list-room>
</view>
 

解決辦法

<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>
<list-room @click="gotode"></list-room>

// 常用於上拉載入下一頁資料。如使用scroll-view導致頁面級沒有滾動，則觸底事件不會被觸發
onReachBottom(){
  console.log("常用於上拉載入下一頁資料")
  uni.showToast({
  title: '沒有更多資料了',
  icon:'none',
  duration: 1000
   });
},