# 封装上啦加载组件
封装代码:
<template>
<view class="load-more">{{loadtext}}</view>
</template>
<script>
export default {
props: {
loadtext:String
}
}
</script>
<style lang="less" scoped>
.load-more {
text-align: center;
color: #aaaaaa;
padding: 15rpx 0;
}
</style>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
引入使用:
<template>
<scroll-view scroll-y class="list" @scrolltolower="loadmore(index)">
<!-- 图文内容区域 -->
<block v-for="(item, index1) in items.list" :key="index1">
<index-list :item="item" :index="index1"></index-list>
</block>
<!-- 上啦加载 -->
<loadMore :loadtext="items.loadtext"></loadMore> ⭐⭐
</scroll-view>
</template>
<script>
import loadMore from '../../components/common/load-more.vue' ⭐⭐
export default {
components: {
loadMore
},
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18