You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

59 lines
1.3 KiB

12 months ago
<!-- z-paging自定义的下拉刷新view -->
<template>
<view class="refresher-container">
<!-- 这里的图片请换成自己项目的图片 -->
<image class="refresher-image" mode="aspectFit" src="@/static/refresher_loading.gif"></image>
<text class="refresher-text">{{statusText}}</text>
</view>
</template>
<script>
export default {
data() {
return {
};
},
computed: {
statusText() {
// 这里可以做i18n国际化相关操作,可以通过uni.getLocale()获取当前语言(具体操作见i18n-demo.vue);
// 获取到当前语言之后,就可以自定义不同语言下的展示内容了
const statusTextArr = ['哎呀,用点力继续下拉!', '拉疼我啦,松手刷新~~', '正在努力刷新中...', '刷新成功啦~'];
return statusTextArr[this.status];
}
},
props: {
status: {
type: Number,
default: function() {
return 0;
},
},
}
}
</script>
<style scoped>
.refresher-container {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
height: 150rpx;
flex-direction: column;
align-items: center;
justify-content: center;
}
.refresher-image {
margin-top: 10rpx;
height: 45px;
width: 45px;
}
.refresher-text {
margin-top: 10rpx;
font-size: 24rpx;
color: #666666;
}
</style>