如何解决快应用页面滑动卡顿问题

华为开发者论坛

于 2021-08-16 13:56:48 发布

阅读量2.8k

点赞数

分类专栏： AGC 文章标签： java

本文链接：https://blog.csdn.net/weixin_44708240/article/details/119728773

版权

问题现象

页面一次加载了100条数据，页面滑动出现卡顿。

问题代码

<template>
  <div class="container">
    <div class="nav">
      <text class="nav-item">list</text>
    </div>
 
    <!-- List -->
    <list class="list" onclick="listClick" onlongpress="listLongPress"
      onscrollbottom="scrollbottom"  id="list" scrollpage="{
   {scrollPage}}">
 
      <list-item type="listItem" class="item"  onclick="listItemClick"
        if="{
   {listData.length>0}}">
           <div for="{
   {listData}}" style="flex-direction:column;">
                <text  class="txt">{
   {
   $item}}--{
   {
   $idx}}</text>
           </div>
      </list-item>
 
      <!-- Loading More  -->
      <list-item type="loadMore" class="load-more" if="{
   {loadMore}}">
        <progress type="circular"></progress>
        <text>More</text>
      </list-item>
    </list>
 
  </div>
</template>
<style>
 
  .container{
   
     flex-direction: column;
  }
 
  .list {
   
    padding-left: 10px;
    padding-<