update dependencies
This commit is contained in:
parent
ed14d577c0
commit
c6487ddfc2
9 changed files with 282 additions and 79 deletions
56
examples/routers/scroll.vue
Normal file
56
examples/routers/scroll.vue
Normal file
|
@ -0,0 +1,56 @@
|
|||
<template>
|
||||
<Scroll :on-reach-edge="loadData" loading-text="L-o-a-d-i-n-g...">
|
||||
<section v-for="item in list">
|
||||
<div class="city">
|
||||
<p>{{ item }}</p>
|
||||
</div>
|
||||
</section>
|
||||
</Scroll>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
list: [1,2,3,4,5,6,7,8,9,10]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
loadData (dir) {
|
||||
return new Promise(resolve => {
|
||||
setTimeout(() => {
|
||||
if (dir > 0) {
|
||||
const first = this.list[0];
|
||||
for (let i = 1; i < 11; i++) {
|
||||
this.list.unshift(first - i);
|
||||
}
|
||||
} else {
|
||||
const last = this.list[this.list.length - 1];
|
||||
for (let i = 1; i < 11; i++) {
|
||||
this.list.push(last + i);
|
||||
}
|
||||
}
|
||||
resolve();
|
||||
}, 500);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
section {
|
||||
margin: 20px;
|
||||
}
|
||||
section > div {
|
||||
width: 300px;
|
||||
padding: 15px;
|
||||
margin: 5px;
|
||||
background-color: #ddf;
|
||||
border: 1px solid #446;
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.ivu-scroll-container {
|
||||
height: 500px;
|
||||
}
|
||||
</style>
|
Loading…
Add table
Add a link
Reference in a new issue