个人房源列表

src/views/housingView/person.vue

@@ -5,11 +5,11 @@
         <div class="dis-f jus-x al-item">
             <div class="body-maxWidth mg-t-35">
                 <div class="dis-f jus-bet">
-                    <div>
-                        <biserialItem v-for="(item,i) in dataList.data.data" :key="i" :item="item"></biserialItem>
+                    <div ref="list">
+                        <biserialItem v-for="(item,i) in pageList[1]" :key="i" :item="item" :imgLoad="watchImgLoad" listId="1"></biserialItem>
                     </div>
                     <div>
-                        <biserialItem></biserialItem>
+                        <biserialItem v-for="(item,i) in pageList[2]" :key="i" :item="item" :imgLoad="watchImgLoad" listId="2"></biserialItem>
                     </div>
                 </div>
             </div>
@@ -19,26 +19,61 @@
 </template>
   
 <script setup>
-import {reactive} from 'vue'
+import {reactive,onMounted,ref} from 'vue'
 import pageTopBar from '../../components/pageTopBar/pageTopBar.vue';
 import seachModule from "../../components/seachModule/seachModule.vue";
 import biserialItem from '../../components/biserialListItem/biserialListItem.vue'
 import listBtmPrompt from "../../components/public/have-questions.vue";
 import api from "../../utils/api";
-
 //获取数据
+let pages=ref(1)
 let dataList= reactive({data:[],count:0})
+let pageList=reactive({1:[],2:[],height1:0,height2:0,tab:2})
 let getDataList=()=>{
-    let postData={}
+    let postData={
+        page:pages.value
+    }
     api.getLists(postData).then(res=>{
         console.log(res.data)
         if(res.code===200){
             dataList.count=res.data.count
             dataList.data=res.data
+            console.log(dataList.data)
+            pageList[1].push(dataList.data.data[0])
+            pageList[2].push(dataList.data.data[1])
         }
     })
 }
-getDataList()
+
+//添加数据
+let addListData=()=>{
+    let num=null
+    if(pageList.tab>=19)return
+    ++pageList.tab
+    console.log(pageList.height1,pageList.height2)
+   if(pageList.height1>pageList.height2){
+        num=2
+    }else{
+        num=1
+    }
+    pageList[num].push(dataList.data.data[pageList.tab])
+}
+
+//监听图片加载
+let watchImgLoad=(id,listId,height)=>{ 
+    console.log(listId,height)
+    pageList[`height${listId}`]+=height
+    // console.log(pageList)
+    addListData()
+}
+
+
+
+//listImg
+onMounted(()=>{
+    getDataList()
+})
+
 </script>
 <style scoped>
 img {