uniapp中uview组件库丰富LoadingPage 加载页

发布时间:2023年12月28日

目录

基本使用

#显示或隐藏

#文字内容

#动画模式

#动画图片

#文字颜色

#文字大小

#图标大小?2.0.32

#背景颜色

#图标颜色

API

#Props


基本使用

<template>
	<view>
		<u-loading-page></u-loading-page>
	</view>
</template>

#显示或隐藏

loading可以指定是否显示加载页

<u-loading-page :loading="true"></u-loading-page>

#文字内容

loading-text可以指定提示内容

<u-loading-page loading-text="loading..."></u-loading-page>

#动画模式

loading-mode可以指定加载动画的模式, 默认为circle

<u-loading-page loading-mode="spinner"></u-loading-page>
<u-loading-page loading-mode="semicircle"></u-loading-page>

#动画图片

image可以指定文字上方用于替换loading动画的图片

<u-loading-page image="/static/logo.png"></u-loading-page>

#文字颜色

color可以指定文字颜色

<u-loading-page color="#666"></u-loading-page>

#文字大小

font-size可以指定文字大小

<u-loading-page font-size="24"></u-loading-page>

#图标大小?2.0.32

icon-size可以指定图标大小

<u-loading-page icon-size="36"></u-loading-page>

#背景颜色

bg-color可以指定背景颜色

<u-loading-page bg-color="#e8e8e8"></u-loading-page>

#图标颜色

loading-color可以指定加载中图标的颜色

<u-loading-page loading-color="#000000"></u-loading-page>

API

#Props

参数说明类型默认值可选值
loadingText提示内容String | Number正在加载-
image文字上方用于替换loading动画的图片String--
loadingMode加载动画的模式Stringcirclespinner \ semicircle
loading是否加载中booleanfalsetrue
bgColor背景颜色String#ffffff-
color文字颜色String#C8C8C8-
fontSize文字大小String | Number19-
iconSize?2.0.32图标大小String | Number28-
loadingColor加载中图标的颜色String#C8C8C8-
文章来源:https://blog.csdn.net/m0_72603435/article/details/135267157
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。