uniapp实现附件选择上传代码（H5，app，小程序可用）

UniApp提供了一套跨平台的开发框架，支持H5、App和微信小程序三种环境。在UniApp中，你可以通过统一的API来实现附件（如图片、文件）的选择和上传功能。以下是一个简单的示例代码：

<template>
  <uni-button @click="selectFile">选择文件</uni-button>
  <uni-input placeholder="已选文件" v-model="filePath" :disabled="uploading"></uni-input>
</template>

<script>
export default {
  data() {
    return {
      filePath: '',
      uploading: false,
    };
  },
  methods: {
    selectFile() {
      const input = document.createElement('input');
      input.type = 'file';
      input.accept = '*/*'; // 设置接受所有类型的文件
      input.click();
      input.addEventListener('change', (e) => {
        this.filePath = e.target.files[0].path;
        if (!this.uploading) {
          this.startUpload();
        }
      });
    },
    startUpload() {
      this.uploading = true;
      uni.uploadFile({
        url: 'your-api-url', // 替换为你的服务器上传接口
        filePath: this.filePath,
        name: 'file',
        header: {}, // 如果有需要，可以设置请求头
        success(res) {
          console.log(res);
          // 根据服务器返回处理上传成功的情况
          this.uploading = false;
        },
        fail(err) {
          console.error(err);
          // 处理上传失败的情况
          this.uploading = false;
        },
      });
    },
  },
};
</script>

在这个例子中，当用户点击“选择文件”按钮时，会触发`selectFile`方法，然后创建一个隐藏的`input[type=file]`元素让用户选择文件。选择完成后，`startUpload`方法会被调用，通过`uni.uploadFile`发送异步请求到服务器进行上传。

注意替换`url`为你实际的后端接口地址，并根据实际需求调整其他配置项。同时，记得在App或小程序的后台服务端配置相应的接收和处理上传文件的逻辑。