uniapp (上传本地图片、图片预览、转换base64格式、上传音频文件)

/*htnl*/

      //点击这张图片会调起函数
//循环coverImg就可以显示小图,点击即可实现预览效果
    


//js

   //location.reload() //可以刷新页面,可以在提交数据成功后使用
export default {
    data() {
        return {
            coverImg: [], //存放上传图片的数组
        }
    },
    method: {

       //上传图片
     async   chooseFile() {
            await uni.chooseImage({
                count: 1,
                success: res => {
                    this.coverImg = res.tempFilePaths

                }
            });
        }
    },

      //点击预览图片
         previewImg(current,) {
                uni.previewImage({
                    current, //当前的图片路径必填
                    urls this.coverImgSrc, //数组文件路径必填
                    loop: true, //循环在5+app才有效
                    indicator: "default" //指数器同样也是5+app有效
                })
            },

     //图片转base64
            async urlTobase64(url) {
                let res = await new Promise((resolve) => {
                    uni.request({
                        url: url, //要转换的url
                        method: 'GET',
                        responseType: 'arraybuffer', 
                        success: res => {
                            resolve(res)
                        }
                    })
                })
                let base64 = wx.arrayBufferToBase64(res.data);
                base64 = `data:image/jpeg;base64,${base64}` //要加上data:image/jpeg;base64, 这个前缀才能显示
                console.log(base64)
            },

          function upAudioFile(){
                          let res= await new Promise((resolve) => {
                            uni.chooseFile({
                                count: 1,//上传数量,最大99
                                extension: ['.mp3'], //限定上传格式
                                success: res => {
                                    resolve(res)
                                }
                            });
                        })
                      console.log(res)  
                        this.baseAudioFile = await this.urlTobase64(res.tempFilePaths[0]) //音频文件也可以处理成base64格式传给后端
                                 },

}


你可能感兴趣的:(uniapp (上传本地图片、图片预览、转换base64格式、上传音频文件))