vue 中获取文件数据的两种方式

最新推荐文章于 2023-07-23 09:46:19 发布

转载最新推荐文章于 2023-07-23 09:46:19 发布 · 1.9k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：https://www.cnblogs.com/sunday123/p/11504885.html

文章标签：

#vue.js

work 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了在Vue项目中实现文件上传功能的方法。通过两个示例展示了如何使用原生HTML输入元素结合Vue.js处理文件选择与提交操作。第一个示例利用@click事件触发文件获取，第二个示例则直接监听@change事件来响应文件选择变化。

// 例1：

<input type="file" ref="file" />

<span @click="getFile">提交</span>

getFile(){

  console.log(this.$refs.file.files)    

}





// 例2：

<input type="file" @change="getFile" />

getFile(e){

  console.log(e.target.files) 

}