<template>
<div>
<vt
ref="virtualTable"
:columns="columns"
:data-source="list"
:itemSize="54"
keyProp="name"
row-key="name"
:scroll="{ y: 850 }"
@selection-change="handleSelectionChange"
>
<a slot="name" slot-scope="{ text }">{{ text }}===</a>
</vt>
</div>
</template>
<script>
import vt from "./components/vt.vue";
export default {
components: {
vt,
},
data() {
return {
columns: [
{
type: "selection",
},
{
title: "name",
dataIndex: "name",
key: "name",
},
],
list:[],
multipleSelection: [],
};
},
created() {
const list = [];
for (let i = 0; i < 2000; i++) {
list.push({
name: "name" + i++,
});
}
this.list=list
},
methods: {
handleSelectionChange(val) {
console.log(
"multipleSelection",
val,
JSON.stringify(val.map((i) => i.name).join(","))
);
this.multipleSelection = val;
},
},
};
</script>
vue antd解决表格大量数据页面卡顿
于 2023-02-17 23:33:40 首次发布