小程序图片压缩，第一部分

Tevin

2024-07-06 d5b47d51876da1ab1a2b382cddc3e253802d646b

 forms/imagePicker/CImageCompressor.vue

@@ -20,6 +20,12 @@

export default {
    name: 'CImageCompressor',
    props: {
        maxSize: {
            type: Number,
            default: 1600,
        },
    },
    data() {
        return {
            // canvas id
@@ -33,6 +39,7 @@
    },
    methods: {
        $compress(tempPaths, callback) {
            this.imgBlobs = []; // 重置已转图片
            if (typeof this.canvasContext === 'undefined') {
                this.canvasContext = Taro.createCanvasContext(this.cavId, this);
            }
@@ -46,7 +53,7 @@
                    }
                    // 完成图片压缩
                    else {
                        console.log(this.imgBlobs);
                        callback(this.imgBlobs);
                    }
                });
            };
@@ -73,12 +80,12 @@
            let width, height;
            // 宽大于高，按宽算
            if (res.width >= res.height) {
                width = Math.min(res.width, 1600);
                width = Math.min(res.width, this.maxSize);
                height = Math.round(width / rate);
            }
            // 按高算
            else {
                height = Math.min(res.height, 1600);
                height = Math.min(res.height, this.maxSize);
                width = Math.round(height * rate);
            }
            return [width, height];
@@ -133,7 +140,14 @@
                const [key, params] = step;
                if (key === 'drawImage') {
                    // 使用图片
                    const img = new Image();
                    const img = (() => {
                        if (typeof Image === 'undefined') {
                            console.log(this.$refs.canvas);
                            return this.$refs.canvas.createImage();
                        } else {
                            return new Image();
                        }
                    })();
                    img.src = tempPath;
                    this.canvasContext.drawImage(img, ...params);
                } else {