提交 a0b1c8e9 作者: 方治民

feat: 优化视频上传组件,增加占位区允许控制 video 是否显示,解决原生组件层级过高覆盖问题

上级 535b1b1d
......@@ -2,8 +2,9 @@
<view class="fui-uploadv__wrap">
<view class="fui-uploadv__item" :style="{width:width+'rpx',height:height+'rpx'}" v-for="(item,index) in urls"
:key="index">
<view :style="{width:width+'rpx',height:height-(isView?0:40)+'rpx',background:'#000'}" v-if="!showVideo"></view>
<video class="fui-upload__video" :style="{width:width+'rpx',height:height-(isView?0:40)+'rpx'}"
:src="getVideoSrc(item)"></video>
:src="getVideoSrc(item)" v-if="showVideo"></video>
<view class="fui-uploadv__del-wrap" :style="{width:width+'rpx'}" v-if="!isView">
<view class="fui-uploadv__flex-row" @tap.stop="reUpload(index)">
<fui-icon name="checkbox" color="#fff" :size="32" v-if="progress[index]===100"></fui-icon>
......@@ -49,6 +50,11 @@
type: [Number, String],
default: 320
},
// 防止原生组件层级问题的视频显示
hideVideo: {
type: Boolean,
default: false
},
fileList: {
type: Array,
default () {
......@@ -146,6 +152,7 @@
//preupload、uploading、success、error
status: [],
progress: [],
showVideo: true,
};
},
created() {
......@@ -154,7 +161,16 @@
watch: {
fileList(vals) {
this.initData(vals)
}
},
hideVideo(value) {
if (value) {
this.showVideo = false
} else {
setTimeout(() => {
this.showVideo = true
}, 300)
}
}
},
computed: {
showAdd() {
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论