uniapp上传文件api如何使用

&ACE&2023-12-18 10:02

在uni-app中使用上传文件API有以下几个步骤：

创建 <input type="file"> 元素，并监听文件选择事件
html 复制代码
```
<input type="file" @change="chooseFile">
```

在 methods 中定义 chooseFile 方法，处理文件选择事件

javascript 复制代码

methods: {
  chooseFile(event) {
    const file = event.target.files[0]
    this.uploadFile(file)
  },
  // ...
}

定义上传文件的方法 uploadFile

javascript 复制代码

methods: {
  // ...
  uploadFile(file) {
    const formData = new FormData()
    formData.append('file', file)

    uni.request({
      url: 'http://example.com/upload',
      method: 'POST',
      data: formData,
      success(response) {
        console.log('上传成功', response.data)
      },
      fail(error) {
        console.error('上传失败', error)
      }
    })
  }
}

在 uploadFile 方法中，使用 uni.request 方法发送文件上传请求。注意将文件数据加入到 FormData 对象中，并将其作为 data 参数传递给 uni.request 方法。

url 参数为上传文件的接口地址，可以根据实际情况进行修改。

method 参数为请求方法，这里使用 POST 方法上传文件。

success 和 fail 分别为请求成功和失败的回调函数，可以根据需要进行处理。

以上是一个简单的上传文件的示例，你可以根据实际需求进行相应的修改和扩展。