更新记录

1.0(2026-06-07)

初次发布


平台兼容性

uni-app x(5.12)

Chrome Safari Android iOS 鸿蒙 微信小程序
√ √ √ √ √ √

其他

多语言 暗黑模式 宽屏模式 蒸汽模式
× × √ ×

uts头像轮播组件(ios/Android 支持自定义头像大小、动画间隔等)

参数

属性 类型 描述
urls any 头像数组
width number 宽
height number 高
overlap number 偏移量
interval number 动画时长
prop PropObject 自定义字段名
maxDisplay number 页面显示头像数量
borderWidth number 头像白边宽度
borderColor string 白边色

示例

<template>
    <view class="container">
        <avatar :urls="avatarUrls"
            :width="40" :height="40"
            :overlap="5" :interval="5000" 
            :maxDisplay="4" :borderWidth="3"
        />
        <avatar :urls="objectUrls"
            :width="40" :height="40"
            :overlap="5" :interval="5000" 
            :maxDisplay="4" :borderWidth="3"
        />
        <avatar :urls="customUrls" :prop="{ url: 'avatar' }"
            :width="40" :height="40"
            :overlap="5" :interval="5000" 
            :maxDisplay="4" :borderWidth="3"
        />
    </view>
</template>

<script setup lang="uts">
    import Avatar from '@/components/Avatar/Avatar.uvue'
    // 格式1:字符串数组
    const avatarUrls = [
            '/static/logo.png',
            '/static/logo.png',
            '/static/logo.png',
            '/static/logo.png',
            '/static/logo.png',
            '/static/logo.png',
    ]
    // 格式2:对象数组(url字段)
    const objectUrls = [
        { url: '/static/logo.png' },
        { url: '/static/logo.png' },
        { url: '/static/logo.png' },
        { url: '/static/logo.png' },
        { url: '/static/logo.png' },
    ]
    // 格式3:对象数组(自定义字段)
    const customUrls = [
        { avatar: '/static/logo.png' },
        { avatar: '/static/logo.png' },
        { avatar: '/static/logo.png' },
        { avatar: '/static/logo.png' },
    ]   
</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

无

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

无

暂无用户评论。