更新记录

0.1.8（2025-05-30） 下载此版本

• feat: 重构，针对uniapp x app增加mode属性，用于是使用计时器还是元素的animate实现

0.1.7（2025-05-16） 下载此版本

• fix: 修复 uniappx ios 初始化尺寸为0导致不生效的问题

0.1.5（2025-04-21） 下载此版本

• feat: 兼容uniappx 鸿蒙next

平台兼容性

uni-app(4.44)

uni-app x(4.61)

其他

lime-loading 加载中

• 用于表示页面或操作的加载状态，给予用户反馈的同时减缓等待的焦虑感，由一个或一组反馈动效组成。

文档

🚀 loading【站点1】 🌍 loading【站点2】 🔥 loading【站点3】

安装

插件市场导入即可，首次导入可以需要重新编译

代码演示

基础

通过 type 属性可以设置加载图标的类型，默认为 circular，可选值为 spinner。nvue只有circular，因为其使用的是原生组件。

<l-loading />
<l-loading type="spinner"/>

横向文字

通过text或插槽设置加载文本,uvue建议使用text

<l-loading>加载中…</l-loading>
<l-loading text="加载中…"></l-loading>

竖向文字

<l-loading :vertical="true">加载中…</l-loading>

尺寸

通过 size 属性设置加载图标的大小，默认单位为 px, uvue必须带单位。

<l-loading size="40rpx"></l-loading>
<l-loading size="60rpx"></l-loading>

颜色

通过 color 属性设置加载图标的颜色。

<l-loading color="red" ></l-loading>

查看示例

• 导入后直接使用这个标签查看演示效果

<!-- // 代码位于 uni_modules/lime-loading/compoents/lime-loading -->
<lime-loading />

插件标签

• 默认 l-loading 为 component
• 默认 lime-loading 为 demo

关于vue2的使用方式

• 插件使用了composition-api, 如果你希望在vue2中使用请按官方的教程vue-composition-api配置
• 关键代码是: 在main.js中 在vue2部分加上这一段即可.

  // vue2
  import Vue from 'vue'
  import VueCompositionAPI from '@vue/composition-api'
  Vue.use(VueCompositionAPI)

API

Props

Slots

主题定制

样式变量

组件提供了下列 CSS 变量，可用于自定义样式。uvue和nvue不支持！