reader/components/createPoster/index.js

import {
    createWxCode
} from '~/api/global'
Component({
    properties: {},
    data: {
        state: false,
        qrCode: ''
    },
    methods: {
        async open() {
            let qrCode = await createWxCode({
                page: "/pages/index/index",
                scene: `?uid=${wx.getStorageSync('uid')}`
            })
            this.setData({
                state: true,
                qrCode
            })
        },
        closeMediaBox() {
            this.setData({
                state: false
            })
        },
        savePoster() {
            const query = wx.createSelectorQuery().in(this);
            let canvas
            query
                .select('#cavansId')
                .fields({
                    node: true,
                    size: true
                }).exec(async (res) => {
                    canvas = res[0].node;
                    const ctx = canvas.getContext('2d');
                    const dpr = wx.getSystemInfoSync().pixelRatio;
                    canvas.width = 646;
                    canvas.height = 959;
                    let pic = canvas.createImage();
                    pic.src = 'https://reader-wx.ai160.com/images/reader/pay/shareBg.jpg'
                    pic.onload = () => {
                        ctx.drawImage(pic, 0, 0, 646, 959);
                        let pl = canvas.createImage();
                        pl.src = this.data.qrCode
                        pl.onload = async () => {
                            ctx.drawImage(pl, 29, 756, 170, 170)
                            let {
                                tempFilePath
                            } = await wx.canvasToTempFilePath({
                                canvas
                            })
                            wx.saveImageToPhotosAlbum({
                                filePath: tempFilePath,
                                success() {
                                    wx.showToast({
                                        title: '保存成功',
                                        icon: 'none'
                                    })
                                }
                            })
                        }
                    }
                })

        }
    }
})