60 lines
1.2 KiB
Vue
60 lines
1.2 KiB
Vue
<template>
|
||
<view>
|
||
<view v-show="status !== 2" class="mix-load-more center">
|
||
<image class="loading-icon" src="/static/loading/hamster.gif"></image>
|
||
<text class="text">{{ textList[status] }}</text>
|
||
</view>
|
||
<view v-show="status === 2" class="mix-load-more center">
|
||
<image class="logo" src="/static/logo-b-w.png"></image>
|
||
<text class="text">国云网络提供技术支持</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
/**
|
||
* 上划加载更多
|
||
* @prop {Number} status 0加载前，1加载中，2没有更多
|
||
* @prop {Array} textList ['加载前提示', '加载中提示', '加载完提示']
|
||
*/
|
||
export default {
|
||
name: "mix-load-more",
|
||
props: {
|
||
status: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
textList: {
|
||
type: Array,
|
||
default () {
|
||
return [
|
||
'上拉显示更多',
|
||
'正在加载 ..',
|
||
'我也是有底线的~'
|
||
];
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.mix-load-more{
|
||
width: 750rpx;
|
||
height: 110rpx;
|
||
}
|
||
.loading-icon{
|
||
width: 64rpx;
|
||
height: 68rpx;
|
||
margin-right: 20rpx;
|
||
}
|
||
.text{
|
||
font-size: 26rpx;
|
||
color: #999;
|
||
}
|
||
.logo{
|
||
width: 34rpx;
|
||
height: 34rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
</style> |