在VueJs中处理大数据

时间:2019-01-05 05:58:26

标签: vue.js

我目前有一个大列表,其中包含约1k +条记录,这些记录已绑定到表。该表还包含用于更新列表数据的输入元素,例如文本框,下拉列表。现在,问题显然与列表绑定到DOM时的性能有关,并且在滚动过程中也很慢。有什么可以改进的吗?,我不想使用分页,也不能使用虚拟滚动,因为我有输入元素,因为它们会触发更新事件。这只是一个示例:

new Vue({
  el: '#app',
  data: {
    bigData: new Array(100000)   
  } 
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.5/vue.js"></script>
<div id="app">
<table>
<thead>
  <tr>
    <td>Id</td>
    <td>Random Text</td>
  </tr>
</thead>
<tbody>
  <tr v-for="(item, index) in bigData">
    <td>{{ index }}</td>
    <td><input type="text" v-model="index"><td>
  </tr>
</tbody>
</table>
</div>

0 个答案:

没有答案