uQrcode uniapp 微信小程序 长按保存图片+转发

主要思路：用引入插件的方式，把uQrcode隐藏起来（visibility: hidden;），等拿到生成二维码的临时路径，把临时路径放入image 里。

---

1.官方文档 https://uqrcode.cn/doc/guide/

根据官方文档指引 去插件市场 安装uqrcode插件

2.页面

uQrcodeLoading 和remake 在这里没用上

<template>
   <view>
                <uQrcode style="visibility: hidden;" ref="uqrcode" canvas-id="qrcode" :value="uQrcodeValue" size="200"
                         :start="true"
                         :loading="uQrcodeLoading" :auto="true" :options="uQrcodeOption" @click="remake">
                    <template v-slot:loading>
                        <u-loadmore status="loading" loading-text=" "/>
                    </template>
                </uQrcode>
                <image style="width: 100%;" mode="aspectFit" show-menu-by-longpress="true" :src="imgSrc"></image>
   </view>
</template>

<script>
    //引入uQrcode 组件。
    import uQrcode from '@/uni_modules/Sansnn-uQRCode/components/u-qrcode/u-qrcode.vue';
    
    export default {
        components: {
            uQrcode
        },
        data() {
          return{
                //二维码设置
                uQrcodeOption: {areaColor: '#FFFFFF', foregroundColor: '#04c9c7'},
                //二维码刷新
                uQrcodeLoading: false,
                //二维码值
                uQrcodeValue: "",
                //图片地址
                imgSrc: "",
                //提交信息
                submitInfo：{
                   phone："",
                   name:""
                }
          }
        },
        onReady(){
                    var that = this;
                    uni.showLoading({
                        title: '正在生成二维码...'
                    });
                    this.uQrcodeValue = "http://baidu.com?phone=" + that.submitInfo.phone +
                        "&name=" + that.submitInfo.name + "&flag=0";
                    //二维码转化成图片
                    setTimeout(function () {
                        that.saveUqrcode();
                    }, 1000 * 5)
        },
        methods:{
           //刷新二维码
            remake() {
                this.uQrcodeValue = "http://baidu.com?phone=" + this.submitInfo.phone +
                    "&name=" + this.submitInfo.name + "&id=" + this.submitSuccess;
            },
            //长按保存二维码
            saveUqrcode() {
                var that = this;
                //pc端临时文件路径为http形式，移动端为base64
                this.$refs.uqrcode.toTempFilePath({
                    success: res => {
                        let base64 = res.tempFilePath.replace(/^data:image\/\w+;base64,/, "");//去掉data:image/png;base64,
                        var fileManager = uni.getFileSystemManager();
                        fileManager.writeFile({
                            filePath: wx.env.USER_DATA_PATH + '/img.jpg', // 指定图片的临时路径
                            data: base64, // 要写入的文本或二进制数据
                            encoding: 'base64', // 指定写入文件的字符编码
                            success: res => {
                                console.log('写入文件成功', res)
                                console.log(wx.env.USER_DATA_PATH + '/img.jpg')
                                // 保存图片到相册
                                //                       uni.saveImageToPhotosAlbum({ 
                                //                           filePath: wx.env.USER_DATA_PATH + '/img.jpg',
                                //                           success: function (res) {
                                //                               console.log('保存成功', res)
                                //                               uni.showToast({
                                //                                   title: '保存成功',
                                //                               })
                                //                           },
                                //                           fail: function (err) {
                                //                               console.log('保存失败', err)
                                //                           }
                                //                       })
                                //图片地址
                                that.imgSrc = wx.env.USER_DATA_PATH + '/img.jpg';
                                uni.hideLoading();
                            },
                            file: err => {
                                console.log('写入文件失败', err)
                            }
                        })
                    }
                });
            },
        }
    }
</script>