11<a href =" https://npmjs.com/package/vue-virtual-scroll-list " >
2- <img src="https://img.shields.io/npm/v/vue-virtual-scroll-list.svg?style=flat" alt="NPM version"/>
2+ <img src="https://img.shields.io/npm/v/vue-virtual-scroll-list.svg?style=flat" alt="NPM version"/>
33</a >
44<a href =" https://vuejs.org/ " >
5- <img src="https://img.shields.io/badge/vue-2.x-brightgreen.svg" alt="Vue version"/>
5+ <img src="https://img.shields.io/badge/vue-2.x-brightgreen.svg" alt="Vue version"/>
66</a >
77<a href =" https://github.com/tangbc/vue-virtual-scroll-list/blob/master/LICENSE " >
8- <img src="https://img.shields.io/github/license/tangbc/vue-virtual-scroll-list.svg" alt="MIT License"/>
8+ <img src="https://img.shields.io/github/license/tangbc/vue-virtual-scroll-list.svg" alt="MIT License"/>
99</a >
1010
1111## vue-virtual-scroll-list
2020
2121## Demos
2222
23- * [ vue-virtual-scroll-list with 100,000 finite data] ( https://tangbc.github.io/vue-virtual-scroll-list/demo /finite/ ) .
23+ * [ vue-virtual-scroll-list with 100,000 finite data] ( https://tangbc.github.io/vue-virtual-scroll-list/examples /finite/ ) .
2424
25- * [ vue-virtual-scroll-list infinite data by increasing 20 each time] ( https://tangbc.github.io/vue-virtual-scroll-list/demo /infinite/ ) .
25+ * [ vue-virtual-scroll-list infinite data by increasing 20 each time] ( https://tangbc.github.io/vue-virtual-scroll-list/examples /infinite/ ) .
2626
2727
28- ## Example
28+ ## Usage
2929
3030#### Using by npm:
3131
@@ -35,26 +35,26 @@ npm install vue-virtual-scroll-list --save
3535
3636``` javascript
3737< template>
38- < div>
39- < virtualList : size= " 40" : remain= " 8" >
40- < Item v- for = " (item, index) of items" : item= " item" : key= " item.id" / >
41- < / virtualList>
42- < / div>
38+ < div>
39+ < virtualList : size= " 40" : remain= " 8" >
40+ < Item v- for = " (item, index) of items" : item= " item" : key= " item.id" / >
41+ < / virtualList>
42+ < / div>
4343< / template>
4444
4545< script>
46- import Item from ' ../item.vue' ;
47- import virtualList from ' vue-virtual-scroll-list' ;
48-
49- export default {
50- name: ' demo' ,
51- data () {
52- return {
53- items: [... ]
54- }
55- },
56- components: { Item, virtualList }
57- }
46+ import Item from ' ../item.vue'
47+ import virtualList from ' vue-virtual-scroll-list'
48+
49+ export default {
50+ name: ' demo' ,
51+ data () {
52+ return {
53+ items: [... ]
54+ }
55+ },
56+ components: { Item, virtualList }
57+ }
5858< / script>
5959```
6060
@@ -67,21 +67,21 @@ The `<Item>` component is included inside but defined outside the `<virtualList>
6767<script src =" https://tangbc.github.io/vue-virtual-scroll-list/dist/vue-virtual-scroll-list.js" ></script >
6868
6969<div id =" app" >
70- <virtual-list :size =" 40" :remain =" 8" >
71- <div class =" item" v-for =" (item, index) of items" :key =" index" >Item: # {{ index }}</div >
72- </virtual-list >
70+ <virtual-list :size =" 40" :remain =" 8" >
71+ <div class =" item" v-for =" (item, index) of items" :key =" index" >Item: # {{ index }}</div >
72+ </virtual-list >
7373</div >
7474```
7575
7676``` javascript
7777new Vue ({
78- el: ' #app' ,
79- data: {
80- items: new Array (100000 )
81- },
82- components: {
83- ' virtual-list' : VirutalList
84- }
78+ el: ' #app' ,
79+ data: {
80+ items: new Array (100000 )
81+ },
82+ components: {
83+ ' virtual-list' : VirutalList
84+ }
8585});
8686```
8787
0 commit comments