axios 上传问本地文件
时间: 2023-10-13 11:06:43 浏览: 116
axios本身并不支持上传本地文件,需要结合HTML5的FormData对象来实现。
示例代码如下:
HTML部分:
```html
<input type="file" id="file-input">
<button onclick="uploadFile()">上传文件</button>
```
JavaScript部分:
```javascript
function uploadFile() {
const fileInput = document.getElementById('file-input');
const file = fileInput.files[0];
const formData = new FormData();
formData.append('file', file);
axios.post('/upload', formData)
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
}
```
在上述代码中,我们首先通过`document.getElementById('file-input')`获取到文件选择框元素,然后通过`files[0]`属性获取到用户选取的文件。接着,我们创建了一个FormData对象,并使用`formData.append('file', file)`将文件添加到FormData中,其中`'file'`是文件对应的参数名。最后,我们使用axios发送POST请求,并将FormData作为请求体发送到服务器。
阅读全文