vue+element解决数据量太大,列表过多,导致渲染过慢(vue-virtual-scroll-list)
1、 安装vue-virtual-scroll-list;npm install vue-virtual-scroll-list --save2、引入下载好的组件,记得局部注册一下组件;<template><div class="table_body"><h1>我是标题</h1><div><virtual-list :size="4
·
1、 安装 vue-virtual-scroll-list;
npm install vue-virtual-scroll-list --save
2、引入下载好的组件,记得局部注册一下组件;
<template>
<div class="table_body">
<h1>我是标题</h1>
<div>
<virtual-list :size="40" :remain="8">
<div v-for="item of items" :key="item.id">{{ item }}</div>
</virtual-list>
</div>
</div>
</template>
<script>
import virtualList from 'vue-virtual-scroll-list'
export default {
data() {
return {
items: []
}
},
methods: {
forss() {
for (let i = 1; i <= 1000000; i++) {
this.items.push({
id: i,
name:
i +
'好好学习,天天向上。'
})
}
}
},
created() {
this.forss()
},
components: { 'virtual-list': virtualList }
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)