vanui官网
<van-form>
<van-cell-group inset>
<van-field name="fileurl" label="简历/作品">
<template #input>
<van-uploader
v-model="formData.fileurl"
:max-size="50 * 1024 * 1024"
accept="file"
:limit="5"
:after-read="afterRead"
>
<template #preview-cover="scope">
<div class="preview-cover van-ellipsis">
{{ scope.name }}
</div>
</template>
</van-uploader>
</template>
</van-field>
</van-cell-group>
</van-form>
export default {
setup() {
let formData = reactive({
fileurl: [
{
url: "https:xxx.doc",
name: "111",
},
],
})
const afterRead = ({ file }, { index }) => {
let fileFormData = new FormData();
fileFormData.append(file.name, file);
let val = fileFormData.get(file.name);
request
.$file(
"/pub/upload",
{ file: val },
{ headers: { "Content-Type": "multipart/form-data" } }
)
.then((res) => {
console.log(formData.fileurl);
formData.fileurl[index] = { url: res.data.url, name: file.name };
});
};
return {
formData,
afterRead
}
}
}