uniapp开发之图片预览

uniapp混合开发

一：关于base64格式图片

  1：h5端可直接使用

uni.previewImage({
                    urls: [that.imageUrl], //图片地址（可以是本地，http，base64等）
                    current:0,//预览地址（也就是urls数组中从第几个开始预览，支持循环预览）
                    success(res) {
                        console.log('预览成功', res)
                    },
                    fail(e) {
                        console.log('预览失败', e)
                    }
                })

  *：1后端返回的base64图片需要在前端进行拼接（"data:image/png;base64,"+res.result）

        2后端绘制图片最好给与一个背景色，例如空白（否则前端有可能只能显示但是预览黑屏转圈）

2：app端直接预览base64会闪退（目前仅h5端可预览64格式）

   解决步骤：引入插件,将Base64转为http图片

          1在终端下载:npm i image-tools --save

           2引入import {pathToBase64,base64ToPath} from 'image-tools'

           3使用base64ToPath(that.data2).then(path=>{
                    that.fileUrls=path;//path即返回的图片路径
                    console.log(that.fileUrls)
                })