wpf 加载列表不卡顿_Taro小程序、H5、快应用列表大量数据卡顿？-CSDN博客

工作中经常遇到各种列表，如果数据量过大的时候经常会碰到卡顿卡死等性能问题。

如果你也遇到类似的问题，小编带你如何解决。

废话不多说，我们直接上干货。

1、代码

import React, { Component } from 'react'import { View, Text } from '@tarojs/components'import Taro from '@tarojs/taro';import VirtualList from '@tarojs/components/virtual-list';import './index.scss'function buildData (offset = 0) {  return Array(100).fill(0).map((_, i) => i + offset);}const Row = React.memo(({ index, style, data }) => {  return (          Row {index}      );})export default class Index extends Component {  state = {    data: buildData(0),  }  componentWillMount () { }  componentDidMount () { }  componentWillUnmount () { }  componentDidShow () { }  componentDidHide () { }  loading = false  listReachBottom() {    console.log('reach  bottom')    Taro.showLoading({      title: '加载中',    })    // 如果 loading 与视图相关，那它就应该放在 `this.state` 里    // 我们这里使用的是一个同步的 API 调用 loading，所以不需要    this.loading = true    setTimeout(() => {      const { data } = this.state      this.setState({        data: data.concat(buildData(data.length))      }, () => {        this.loading = false;        Taro.hideLoading()      })    }, 1000)  }  render () {    const { data } = this.state    const dataLen = data.length    const itemSize = 100    return (