#效果图
#思路
##步骤:
###一、利用picker api选择1张图片
实例化选择器参数(使用new PhotoSelectOptions())
实例化图片选择器 (使用newPhotoViewPicker() )
调用图片选择器的select方法传入选择器参数完成图片选取获得结果
利用picker api选择1张图片
async selectImage(maxnum: number) {
// 1.1 实例化选择参数
let opts = new picker.PhotoSelectOptions()
opts.MIMEType = picker.PhotoViewMIMETypes.IMAGE_TYPE
opts.maxSelectNumber = maxnum
// 1.2 打开相册来选择照片返回(选择相册照片的数组)
let viewer = new picker.PhotoViewPicker()
let res = await viewer.select(opts)
return res.photoUris
}
//点击头像
.onClick(async () => {
// 1. 使用picker选择相册中的图片 let urls = await this.selectImage(1) AlertDialog.show({message:JSON.stringify(urls[0])})
// 2. 利用fs将相册图片拷贝到缓存目录中
// 3. 利用reqeust.uploadFile完成图片上传
})
##拷贝选择图片到缓存目录
// 2. 拷贝到应用程序缓存目录
async copyToCacheDir(photoImagePath: string) {
// 1. 使用openSync将相册中的图片加载到内存中得到内存的数字指向
let file = fs.openSync(photoImagePath, fs.OpenMode.READ_ONLY)
// 2. 使用copyFileSync完成图片拷贝到应用程序缓存中
let dir = getContext().cacheDir
let type = 'jpg'
let filename = Date.now() + '.' + type
let fullpath = dir + '/' + filename
fs.copyFileSync(file.fd, fullpath)
// 3. 返回文件名和文件的扩展名
// ['123123234.jpg','jpg']
return [filename, type]
}
//点击头像
.onClick(async () => {
// 1. 使用picker选择相册中的图片 let urls = await this.selectImage(1) // AlertDialog.show({ message: JSON.stringify(urls[0]) })
// 2. 利用fs将相册图片拷贝到缓存目录中 let fileInfo = await this.copyToCacheDir(urls[0]) AlertDialog.show({ message: JSON.stringify(fileInfo, null, 2) })
})
###二、利用 request.uploadFile 进行图片上传
准备好参数调用request.uploadFile()获得上传对象 uploader
'Content-Type': 'multipart/form-data'
给uploader对象注册progress事件,监听上传进度 requestRes.on("progress", (uploadedSize: number, totalSize: number)=>{})
给uploader对象注册fail事件,监听报错信息requestRes.on('fail', (taskStates) => {})
这是接口文档