Skip to content

Commit da20585

Browse files
committed
Update fix.
1 parent c8ea909 commit da20585

File tree

10 files changed

+32
-33
lines changed

10 files changed

+32
-33
lines changed

README.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@
44

55
## vue-virtual-scroll-list
66

7-
> A vue component that support big data by using virtual scroll list. Tiny, smooth and without any dependence.
7+
> A vue component support big data by using virtual scroll list. Tiny, smooth and without any dependence.
88
99

1010
## How it works
1111

12-
<img src="https://tangbc.github.io/github-images/virtual-scroll-list-4.gif">
12+
<img src="https://tangbc.github.io/github-images/virtual-scroll-list-2.gif">
1313

1414

1515
## Demos
@@ -35,10 +35,7 @@ Using Vue single file components:
3535
```javascript
3636
<template>
3737
<div>
38-
<VirtualList
39-
:size="40"
40-
:remain="8"
41-
>
38+
<VirtualList :size="40" :remain="8">
4239
<Item v-for="(item, index) of items" :item="item" :key="item.id" />
4340
</VirtualList>
4441
</div>
@@ -76,6 +73,11 @@ The `<Item />` component is defined outside but included inside the `<VirtualLis
7673
| toBottom | Event | * | An event emit by virtual list component when the list is scrolled on bottom. |
7774

7875

76+
## Contributions
77+
78+
Welcome to improve vue-virtual-scroll-list by any pull request or issue!
79+
80+
7981
## License
8082

8183
[MIT License](https://github.com/tangbc/vue-virtual-scroll-list/blob/master/LICENSE)

demo/build/finite.js

Lines changed: 1 addition & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/build/finite.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/build/infinite.js

Lines changed: 2 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/build/infinite.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/common.css

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,12 @@
55
}
66
.appWraper {
77
width: 440px;
8-
position: absolute;
9-
left: 50%;
10-
margin-left: -220px;
8+
margin: 0 auto;
119
overflow-y: auto;
1210
box-shadow: 4px 6px 20px #e6e6e6;
11+
}
12+
@media (max-width: 1024px) {
13+
.appWraper {
14+
width: 100%;
15+
}
1316
}

demo/finite/finite.vue

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
<template>
22
<div>
3-
<VirtualList
4-
:size="40"
5-
:remain="8"
6-
>
3+
<VirtualList :size="40" :remain="8">
74
<Item v-for="(udf, index) of items" :index="index" :key="index" />
85
</VirtualList>
96
</div>
@@ -30,6 +27,8 @@
3027
.virtual-list {
3128
border-radius: 3px;
3229
border: 1px solid #ddd;
30+
-webkit-overflow-scrolling: touch;
31+
overflow-scrolling: touch;
3332
}
3433
</style>
3534

demo/finite/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" type="text/css" href="../common.css">
88
</head>
99
<body>
10-
<h1 class="title">Vue virtual list, with 10,0000 finite data.</h1>
10+
<h1 class="title">Vue virtual list, with 100,000 finite data.</h1>
1111
<div class="appWraper">
1212
<div id="app"></div>
1313
</div>

demo/infinite/infinite.vue

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,6 @@
11
<template>
22
<div>
3-
<VirtualList
4-
:size="40"
5-
:remain="8"
6-
v-on:toBottom="onBottom"
7-
>
3+
<VirtualList :size="40" :remain="8" v-on:toBottom="onBottom">
84
<Item v-for="(udf, index) of items" :index="index" :key="index" />
95
</VirtualList>
106
</div>
@@ -31,7 +27,7 @@
3127
3228
methods: {
3329
onBottom () {
34-
this.items = this.items.concat(getList());
30+
this.items = this.items.concat(getList(20));
3531
}
3632
}
3733
}
@@ -41,6 +37,8 @@
4137
.virtual-list {
4238
border-radius: 3px;
4339
border: 1px solid #ddd;
40+
-webkit-overflow-scrolling: touch;
41+
overflow-scrolling: touch;
4442
}
4543
</style>
4644

package.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "vue-virtual-scroll-list",
33
"version": "1.0.2",
4-
"description": "A vue component that support big data by using virtual scroll list. Tiny, smooth and without any dependence.",
4+
"description": "A vue component support big data by using virtual scroll list. Tiny, smooth and without any dependence.",
55
"main": "src/index.js",
66
"scripts": {
77
"demo": "webpack --watch --config webpack.config.js"
@@ -14,6 +14,10 @@
1414
"scroll-list",
1515
"virtual-list"
1616
],
17+
"repository": {
18+
"type": "git",
19+
"url": "https://github.com/tangbc/vue-virtual-scroll-list"
20+
},
1721
"author": "TANG",
1822
"license": "MIT",
1923
"devDependencies": {

0 commit comments

Comments
 (0)