loadmore

loadmore 加载更多

组件结构

<template>
	<view class="tui-loadmore">
		<view :class="['tui-loading-'+index, (index==3 && type)?'tui-loading-'+type:'']"></view>
		<view class="tui-loadmore-tips">{{text}}</view>
	</view>
</template>

组件脚本

<script>
	export default {
		name: "tuiLoadmore",
		props: {
			//显示文本
			text: {
				type: String,
				default: "正在加载..."
			},
			//loading 样式 :1,2,3
			index: {
				type: Number,
				default: 1
			},
			//颜色设置,只有index=3时生效:primary,red,orange,green
			type: {
				type: String,
				default: ""
			}
		}
	}
</script>

组件样式

... 此处省略n行

脚本说明

props

参数 类型 描述 默认值
text String 等待提示 正在加载...
index Number loading 样式 :1,2,3 1
type String 颜色设置,仅index=3时生效:primary,red,orange,green

methods

示例

H5预览地址

https://www.thorui.cn/h5/#/pages/extend/loading/loading

H5二维码

小程序二维码