更新记录

1.0.0（2026-04-14） 下载此版本

初始化

平台兼容性

uni-app(4.85)

uni-app x(4.85)

简介

dl-upload-imageVideo 是一个基于 uni-app 的通用图片视频选择器组件，支持从相册或相机选择图片和视频。它提供底部弹窗样式的选择菜单，内置视频预览功能，并允许外部通过 props 自定义按钮文字和样式。组件兼容 Vue 2 和 Vue 3。

平台兼容性

Props 属性

方法（通过 ref 调用）

使用示例

1. 基础用法

<template>
    <view>
        <button @click="pickFile">选择文件</button>
        <button @click="previewVideo">预览示例视频</button>
        <uploadImageVideo ref="uploadImageVideoRef" />
    </view>
</template>

<script>
import uploadImageVideo from '@/uni_modules/dl-upload-imageVideo/components/dl-upload-imageVideo/dl-upload-imageVideo.vue'

export default {
    components: { uploadImageVideo },
    data:{
        srcArr:[]
    },
    methods: {
        pickFile() {
            this.$refs.uploadImageVideoRef.openFileFn((result) => {
                // 处理上传等操作
                result.tempFiles.forEach(item=>{
                    this.srcArr.push(item.tempFilePath)
                })
            })
        },
        previewVideo() {
            // 传入一个视频文件路径（可以是本地临时路径或网络URL）
            this.$refs.uploadImageVideoRef.seeVideo(this.srcArr[0])
        }
    }
}
</script>