fix: 回显问题
This commit is contained in:
@ -2,13 +2,13 @@
|
|||||||
* @Author: zhaojinfeng 121016171@qq.com
|
* @Author: zhaojinfeng 121016171@qq.com
|
||||||
* @Date: 2023-08-16 17:33:41
|
* @Date: 2023-08-16 17:33:41
|
||||||
* @LastEditors: zhaojinfeng 121016171@qq.com
|
* @LastEditors: zhaojinfeng 121016171@qq.com
|
||||||
* @LastEditTime: 2023-08-16 18:32:13
|
* @LastEditTime: 2023-08-16 18:58:09
|
||||||
* @FilePath: \vue3\packages\upload-list\index.vue
|
* @FilePath: \vue3\packages\upload-list\index.vue
|
||||||
* @Description:
|
* @Description:
|
||||||
*
|
*
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<el-upload v-model:file-list="value" :accept="accept" :disabled="disabled" :http-request="httpRequest">
|
<el-upload v-model:file-list="userFiles" :accept="accept" :disabled="disabled" :http-request="httpRequest">
|
||||||
<el-button type="primary" plain>
|
<el-button type="primary" plain>
|
||||||
点击上传
|
点击上传
|
||||||
</el-button>
|
</el-button>
|
||||||
@ -39,7 +39,7 @@ const emit = defineEmits<{
|
|||||||
(event: 'update:fileList', file: FileVO[]): void
|
(event: 'update:fileList', file: FileVO[]): void
|
||||||
}>()
|
}>()
|
||||||
|
|
||||||
let value = $ref<UploadUserFile[]>([])
|
const userFiles = ref<UploadUserFile[]>([])
|
||||||
|
|
||||||
async function httpRequest({ file, onProgress, onSuccess, onError }: UploadRequestOptions) {
|
async function httpRequest({ file, onProgress, onSuccess, onError }: UploadRequestOptions) {
|
||||||
const formData = new FormData()
|
const formData = new FormData()
|
||||||
@ -58,16 +58,20 @@ async function httpRequest({ file, onProgress, onSuccess, onError }: UploadReque
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function init() {
|
userFiles.value = props.fileList.map(file => ({
|
||||||
if (value.length === 0) {
|
|
||||||
value = props.fileList.map(file => ({
|
|
||||||
name: file.name!,
|
name: file.name!,
|
||||||
url: file.url,
|
url: file.url,
|
||||||
status: 'success',
|
status: 'success',
|
||||||
}))
|
percentage: 100,
|
||||||
}
|
uid: file.id,
|
||||||
}
|
}))
|
||||||
init()
|
|
||||||
|
|
||||||
watch(() => props.fileList, init)
|
watch(() => userFiles, (files) => {
|
||||||
|
emit('update:fileList', files.value.map(file => ({
|
||||||
|
name: file.name!,
|
||||||
|
url: file.url,
|
||||||
|
status: 'success',
|
||||||
|
percentage: 100,
|
||||||
|
})))
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
Reference in New Issue
Block a user