feat: 使用scroll-view替换list-view

pages/template/custom-tab-bar/custom-tab-bar-tab1.uvue

 <template>
-  <list-view ref="listView" class="list" :rebound="false" :scroll-with-animation="true" :scroll-y="true" @scrolltolower="loadData()"
+  <scroll-view ref="listView" class="list" :rebound="false" :scroll-with-animation="true" :scroll-y="true" @scrolltolower="loadData()"
     @scroll="onScroll">
-    <list-item class="list-item" v-for="(item, index) in dataList" :key="index">
+    <view class="list-item" v-for="(item, index) in dataList" :key="index">
       <text class="title">{{item.title}}</text>
-    </list-item>
-  </list-view>
+    </view>
+  </scroll-view>
 </template>
 
 <script>
@@ -24,7 +24,7 @@
     methods: {
       loadData() {
         let index = this.dataList.length
-        for (let i = 0; i < 10; i++) {
+        for (let i = 0; i < 20; i++) {
           this.dataList.push({
             title: index.toString(),
           } as ListItem)
@@ -57,4 +57,4 @@
     font-size: 16px;
     text-align: center;
   }
-</style>
\ No newline at end of file
+</style>

pages/template/custom-tab-bar/custom-tab-bar.uvue

@@ -65,7 +65,7 @@
         ] as TabItem[],
         selectedIndex: -1,
         displayArrow: false,
-        $tabViewHeight: 0
+        tabViewHeight: 0
       }
     },
     onLoad() {
@@ -73,7 +73,7 @@
     },
     onReady() {
       this.setSelectedIndex(0)
-      this.$tabViewHeight = (this.$refs["tabview"] as Element).getBoundingClientRect().height
+      this.tabViewHeight = (this.$refs["tabview"] as Element).getBoundingClientRect().height
     },
     onUnload() {
       uni.$off('tabchange', this.onTabPageEvent)
@@ -86,7 +86,7 @@
         }
       },
       onTabPageEvent(top : number) {
-        this.displayArrow = top > this.$tabViewHeight
+        this.displayArrow = top > this.tabViewHeight
       },
       setSelectedIndex(index : number) {
         if (this.selectedIndex === index) {