uview使用upload上传图片

UViewUI是一个轻量级、高性能的Vue UI组件库，它支持通过`u-upload`组件来实现文件上传功能，包括图片上传。在UView中上传图片通常涉及以下几个步骤：

1. 引入组件：首先在你的Vue项目中引入`u-upload`组件：

<template>
  <u-upload :action="uploadUrl" :multiple="false" :file-list="imageList" @change="handleImageChange">
    <img v-if="imageList.length > 0" :src="imageList[0].url" alt="图片预览"/>
    <i v-else class="u-icon u-icon-image" slot="trigger">选择图片</i>
  </u-upload>
</template>

2. 定义配置：`action`属性指定了文件提交的URL，`multiple`设置是否允许一次上传多张图片，默认是`true`，如果只想上传一张可以设置为`false`。

3. 数据绑定和处理函数：`file-list`表示已选文件列表，`handleImageChange`是事件处理器，会在用户选择图片后触发，接收上传的文件信息：

export default {
  data() {
    return {
      uploadUrl: 'your-api-url-for-uploading',
      imageList: []
    };
  },
  methods: {
    handleImageChange(file) {
      this.imageList = [file];
      // 如果需要的话，你可以在这里对上传的图片做进一步处理，如压缩等
      // 然后发送请求到服务器
    }
  }
}

4. 发送请求：一般情况下，你需要在这个事件处理器里调用后端API上传文件，并将响应结果保存或更新数据。