vue获取选择文件的绝对路径
时间: 2024-01-03 16:54:59 浏览: 358
获取指定目录下所有文件的绝对路径和文件名
4星 · 用户满意度95%
由于浏览器的安全限制,Vue 无法直接获取选择文件的绝对路径。但是可以通过以下方式获取选择文件的文件名和文件内容:
1. 使用 `input` 标签并设置 `type="file"`,并添加 `@change` 事件监听器。
```html
<input type="file" @change="onFileChange">
```
2. 在 `onFileChange` 函数中获取文件对象和文件名。
```javascript
onFileChange(event) {
const file = event.target.files[0]
const fileName = file.name
// ...
}
```
3. 如果需要读取文件内容,可以使用 `FileReader` API。
```javascript
onFileChange(event) {
const file = event.target.files[0]
const fileName = file.name
const reader = new FileReader()
reader.onload = () => {
const fileContent = reader.result
// ...
}
reader.readAsText(file)
}
```
注意,这里获取的文件路径是相对路径,不是绝对路径。如果需要使用绝对路径,可以考虑上传文件时将文件名和内容一起传给后端,在后端获取文件的绝对路径。
阅读全文