uview--上传图片

第一步：

   项目中引入uview 库  （详见）

项目 引入 uView_vue引入uview_qq_2524963996的博客-CSDN博客

第二步：

    在 uview 官网  uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架

    在合适的位置上 放上 上传图片的一段代码

    代码如下：

   

 
      
 

                fileList5: []

                //添加
                afterRead5(file, lists, name) {
        			this.uploadFileToServer(file);
	        },
                //删除
                deletePic5(file, index) {
			this.fileList5.splice(index, 1);
		    },

	            // 上传图片

		       uploadFileToServer(file, num) {
                      console.log('fli', file);
                      let that = this;
                      uni.uploadFile({
                        // 上传服务器
                      url: 'https://yapi.care-bay.com/zg/common/upload', // 上传服务器的接口地址
                      filePath: file.file[0].url, // 要上传的文件路径
                      name: 'file', // 文件对应的 key 值，服务器端用于获取文件的字段名
                      formData: {
                      fileType: 3 // 上传文件的类型，此处为示例值，您可以根据实际需要设置
                      // file: file.file.url // 上传文件的字段名，此处为示例值，您可以根据实际需要设置
    },
                      success: (res) => {
                      that.fileList5 = [];
                      // 上传成功的回调处理，你可以根据服务器返回的数据来处理上传结果
                      let data = JSON.parse(res.data);
                      // 存入对象 必须是 url
                      let url = {
                        url: data.url
                  };
                      //显示
                  that.fileList5.push(url);
            },
                    fail: (err) => {
                  // 上传失败的回调处理
                  console.error('上传失败', err);
    }
  });
}

        一一解释

  fileList5：图片显示集合      

  deletePic5： 删除图片

  afterRead5 ：上传之后参数函数

  max-count  ：最大选择图片的数量

   name:         上传文件的字段名，供后端获取使用

  multiple:  是否开启图片多选，部分安卓机型不支持

可以自定义图片：----------

Upload 上传 | uView 2.0 - 全面兼容nvue的uni-app生态框架 - uni-app UI框架

注意一下是 2.X