更新记录

2.1.0（2024-07-07） 下载此版本

1、iconfont 图标改成在线链接地址

2.0.1（2024-05-22） 下载此版本

1. 新增预览图加载动画
2. 新增预览图加载失败时可以重新点击加载预览图
3. 优化预览图加载方式、切换方式，使得多张图片预览的情况下更加流畅
4. 修复小程序端已知问题和部分bug

2.0.0（2024-05-22） 下载此版本

1、新增预览图加载动画 2、新增预览图加载失败时可以重新点击加载预览图 3、优化预览图加载方式、切换方式，使得多张图片预览的情况下更加流畅 4、修复小程序端已知问题和部分bug

平台兼容性

使用方法

<template>
    <view class="content">
        <uon-preview src="/static/animo.png"></uon-preview>

        <!-- 使用插槽 -->
        <uon-preview src="/static/long.jpg">
            <text>点击预览长图</text>
        </uon-preview>

        <!-- Array<String> 展示 -->
        <view v-for="(item, index) in data" :key="index">
            <uon-preview :src="item.img" :list="data" :img-index="index">
                <text>{{ 'list--预览图片----' + index }}</text>
            </uon-preview>
        </view>

        <!-- Array<Object> 展示 -->
        <view v-for="(item, index) in objecList" :key="index">
            <uon-preview :src="item.img" :list="objecList" :img-index="index" key-name="img">
                <text>{{ item.label + index }}</text>
            </uon-preview>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                imageUrl: 'https://img.alicdn.com/imgextra/i4/O1CN01aG16y424E11XsURUd_!!6000000007358-2-tps-206-240.png',
                data: [
                    'https://www.001acg.com/wp-content/uploads/2023/09/2e387-006yt1Omgy1h8kvgn9lypj30jn0rswj5.jpg', 
                    'https://www.001acg.com/wp-content/uploads/2023/09/78f78-006yt1Omgy1h8pgxy2kknj31jk26p7rq.jpg', 
                    'https://img.alicdn.com/imgextra/i4/O1CN01aG16y424E11XsURUd_!!6000000007358-2-tps-206-240.png'
                ],
                objecList: [
                    { img: 'https://www.001acg.com/wp-content/uploads/2023/09/2e387-006yt1Omgy1h8kvgn9lypj30jn0rswj5.jpg', label: '预览图片----' },
                    { img: 'https://www.001acg.com/wp-content/uploads/2023/09/78f78-006yt1Omgy1h8pgxy2kknj31jk26p7rq.jpg', label: '预览图片----' },
                    { img: 'https://img.alicdn.com/imgextra/i4/O1CN01aG16y424E11XsURUd_!!6000000007358-2-tps-206-240.png', label: '预览图片----' },
                ]
            };
        }
    }
</script>

组件属性