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

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



基本使用

<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 加载动画的模式 String circle spinner \ semicircle
loading 是否加载中 boolean false true
bgColor 背景颜色 String #ffffff -
color 文字颜色 String #C8C8C8 -
fontSize 文字大小 String | Number 19 -
iconSize 2.0.32 图标大小 String | Number 28 -
loadingColor 加载中图标的颜色 String #C8C8C8 -
相关文章
|
13小时前
|
移动开发 小程序 iOS开发
uniapp组件库fullScreen 压窗屏的适用方法
uniapp组件库fullScreen 压窗屏的适用方法
|
15小时前
|
移动开发 小程序 API
uniapp组件库Modal 模态框 的使用方法
uniapp组件库Modal 模态框 的使用方法
|
15小时前
|
移动开发 小程序 API
uniapp组件库SwipeAction 滑动操作 使用方法
uniapp组件库SwipeAction 滑动操作 使用方法
|
15小时前
|
移动开发 小程序 API
uniapp组件库Popup 弹出层 的使用方法
uniapp组件库Popup 弹出层 的使用方法
|
15小时前
|
移动开发 小程序 API
uniapp组件库中Collapse 折叠面板 的使用方法
uniapp组件库中Collapse 折叠面板 的使用方法
|
15小时前
|
移动开发 小程序 API
uniapp中uview组件库TopTips 顶部提示使用方法
uniapp中uview组件库TopTips 顶部提示使用方法
|
15小时前
|
移动开发 小程序 API
uniapp中uview组件库的NoticeBar 滚动通知 使用方法
uniapp中uview组件库的NoticeBar 滚动通知 使用方法
|
15小时前
|
移动开发 小程序 API
uniapp中uview组件库的AlertTips 警告提示使用方法
uniapp中uview组件库的AlertTips 警告提示使用方法
|
15小时前
|
移动开发 小程序 API
uniapp中uview组件库丰富的ActionSheet 操作菜单使用方法
uniapp中uview组件库丰富的ActionSheet 操作菜单使用方法
|
14小时前
|
JavaScript 小程序 前端开发
小程序;vue;uniapp优缺点(各5条)
小程序;vue;uniapp优缺点(各5条)
7 1

热门文章

最新文章