uniapp 多图片上传

在 UniApp 中实现多图片上传可以使用以下步骤：

1. 在 `pages` 目录下创建一个新的页面，比如 `UploadImages.vue`。
2. 在 `UploadImages.vue` 中添加一个用于显示已上传图片的容器，可以使用 `uni-image` 组件。
3. 添加一个按钮或其他触发上传的元素。
4. 在点击触发元素时，调用 `uni.chooseImage` 方法选择需要上传的图片，该方法会返回选中的图片路径。
5. 使用 `uni.uploadFile` 方法将选中的图片上传到服务器。可以使用循环遍历的方式逐个上传图片，或者将多个图片打包成一个文件再上传。
6. 在上传成功的回调中，将服务器返回的图片路径保存到本地或显示在页面上。

以下是一个示例代码：

<template>
  <view class="container">
    <view class="uploaded-images">
      <uni-image v-for="(image, index) in uploadedImages" :src="image" :key="index"></uni-image>
    </view>
    <uni-button @click="chooseImages">选择图片</uni-button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      uploadedImages: [] // 已上传的图片路径
    };
  },
  methods: {
    chooseImages() {
      uni.chooseImage({
        count: 9, // 最多可选择的图片数量
        success: (res) => {
          const tempFilePaths = res.tempFilePaths; // 选中的图片路径数组
          this.uploadImages(tempFilePaths);
        }
      });
    },
    uploadImages(images) {
      images.forEach((image) => {
        uni.uploadFile({
          url: 'https://your-server.com/upload', // 上传的服务器接口地址
          filePath: image,
          name: 'file',
          success: (res) => {
            // 上传成功，保存图片路径
            const data = JSON.parse(res.data);
            this.uploadedImages.push(data.path);
          }
        });
      });
    }
  }
};
</script>

<style>
.container {
  padding: 20px;
}

.uploaded-images {
  display: flex;
  flex-wrap: wrap;
}

.uni-image {
  margin-right: 10px;
  margin-bottom: 10px;
}
</style>

上述代码中，点击 "选择图片" 按钮会调用 `uni.chooseImage` 方法选择图片，并通过 `uni.uploadFile` 方法分别上传到服务器，上传成功后将返回的图片路径保存到 `uploadedImages` 数组中，并通过 `v-for` 指令渲染出已上传的图片。

请注意替换示例代码中的上传服务器接口地址为实际的后端接口地址，并根据实际需求进行相应的调整。