更新记录

0.0.5（2024-09-25） 下载此版本

• feat: 兼容uniappx

0.0.4（2023-05-22） 下载此版本

• chore: vue2

0.0.3（2023-05-15） 下载此版本

• chore: 字节

平台兼容性

lime-image 图片 加强版

• 对内置image组件加强功能,兼容uniapp/uniappx(web,ios,安卓)

说明

本插件在原来的image组件上，增加如下功能：

• UI加载状态：加载中，加载失败
• 插件依赖lime-shared、lime-svg(收费)，不喜勿下。

• 安装

• 在市场导入插件即可在任意页面使用，无须再import

使用

• 提供简单的使用示例，更多请查看下方的demo

// mode
<l-image mode="widthFix" src="https://picsum.photos/200/300?random=lime" />

状态

// 自定义加载状态
<l-image mode="widthFix" src="https://picsum.photos/200/300?random=lime">
    <template #loading>
        <text>加载中</text>
    </template>
    <template #error>
        <text>加载失败</text>
    </template>
</l-image>

形状

• shape: 有round，circle，square

// 自定义加载状态
<l-image shape="round" src="https://picsum.photos/200/300?random=lime"></l-image>

查看示例

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

 // 代码位于 uni_modules/lime-image/compoents/lime-image 
<lime-image />

插件标签

• 默认 l-image 为 component
• 默认 lime-image 为 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

• 所有内置的props与原组件一致
• 所以就不细列出

Events

Expose

打赏

如果你觉得本插件，解决了你的问题，赠人玫瑰，手留余香。