mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-24 10:20:19 +08:00
fix(Uploader): should't emit click-preview when delete (#4407)
This commit is contained in:
parent
fabb61593f
commit
3fd40d7929
@ -200,52 +200,61 @@ export default createComponent({
|
|||||||
this.$emit('click-preview', file, this.detail);
|
this.$emit('click-preview', file, this.detail);
|
||||||
},
|
},
|
||||||
|
|
||||||
renderPreview() {
|
renderPreviewItem(item, index) {
|
||||||
if (!this.previewImage) {
|
const DeleteIcon = (
|
||||||
return;
|
<Icon
|
||||||
}
|
name="delete"
|
||||||
|
class={bem('preview-delete')}
|
||||||
|
onClick={event => {
|
||||||
|
event.stopPropagation();
|
||||||
|
this.onDelete(item, index);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
return this.fileList.map((item, index) => (
|
const Preview = isImageFile(item) ? (
|
||||||
|
<Image
|
||||||
|
fit={this.imageFit}
|
||||||
|
src={item.content || item.url}
|
||||||
|
class={bem('preview-image')}
|
||||||
|
width={this.previewSize}
|
||||||
|
height={this.previewSize}
|
||||||
|
onClick={() => {
|
||||||
|
this.onPreviewImage(item);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<div
|
||||||
|
class={bem('file')}
|
||||||
|
style={{
|
||||||
|
width: this.previewSizeWithUnit,
|
||||||
|
height: this.previewSizeWithUnit
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Icon class={bem('file-icon')} name="description" />
|
||||||
|
<div class={[bem('file-name'), 'van-ellipsis']}>
|
||||||
|
{item.file ? item.file.name : item.url}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
return (
|
||||||
<div
|
<div
|
||||||
class={bem('preview')}
|
class={bem('preview')}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
this.onClickPreview(item);
|
this.onClickPreview(item);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{isImageFile(item) ? (
|
{Preview}
|
||||||
<Image
|
{DeleteIcon}
|
||||||
fit={this.imageFit}
|
|
||||||
src={item.content || item.url}
|
|
||||||
class={bem('preview-image')}
|
|
||||||
width={this.previewSize}
|
|
||||||
height={this.previewSize}
|
|
||||||
onClick={() => {
|
|
||||||
this.onPreviewImage(item);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<div
|
|
||||||
class={bem('file')}
|
|
||||||
style={{
|
|
||||||
width: this.previewSizeWithUnit,
|
|
||||||
height: this.previewSizeWithUnit
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<Icon class={bem('file-icon')} name="description" />
|
|
||||||
<div class={[bem('file-name'), 'van-ellipsis']}>
|
|
||||||
{item.file ? item.file.name : item.url}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<Icon
|
|
||||||
name="delete"
|
|
||||||
class={bem('preview-delete')}
|
|
||||||
onClick={() => {
|
|
||||||
this.onDelete(item, index);
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
));
|
);
|
||||||
|
},
|
||||||
|
|
||||||
|
renderPreviewList() {
|
||||||
|
if (this.previewImage) {
|
||||||
|
return this.fileList.map(this.renderPreviewItem);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
renderUpload() {
|
renderUpload() {
|
||||||
@ -299,7 +308,7 @@ export default createComponent({
|
|||||||
return (
|
return (
|
||||||
<div class={bem()}>
|
<div class={bem()}>
|
||||||
<div class={bem('wrapper')}>
|
<div class={bem('wrapper')}>
|
||||||
{this.renderPreview()}
|
{this.renderPreviewList()}
|
||||||
{this.renderUpload()}
|
{this.renderUpload()}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user