el-upload的v-model
时间: 2023-08-19 09:10:37 浏览: 105
vue中el-upload上传图片到七牛的示例代码
el-upload组件的v-model属性用于实现双向绑定,即将上传的文件或文件列表绑定到一个变量上。使用v-model可以方便地获取用户选择的文件或上传成功后的文件列表。
例如,可以将v-model绑定到一个data中的变量上:
```html
<template>
<el-upload
v-model="fileList"
action="/upload"
:auto-upload="false"
:file-list="fileList"
:on-change="handleChange"
>
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<el-button size="small" type="success" @click="upload">上传到服务器</el-button>
</el-upload>
</template>
<script>
export default {
data() {
return {
fileList: []
};
},
methods: {
handleChange(file, fileList) {
this.fileList = fileList;
},
upload() {
// 执行上传操作
}
}
}
</script>
```
在上面的示例中,v-model绑定到了data中的fileList变量上,当用户选择了文件后,fileList会自动更新。handleChange方法用于更新fileList变量,upload方法用于上传文件到服务器。
注意,el-upload组件需要设置auto-upload为false,以便手动控制上传操作。
阅读全文