uniapp app端全局水印方案

下面这段代码要在首页展示

<template>
   <canvas id="watermarkCanvas" class="watermarkCans" canvas-id="watermarkCanvas"></canvas>
</template>

export default {
   mounted() {
        this.addWaterMark('测试')
	},

   methods:{
   addWaterMark(msg) {
        console.log(msg);
        // #ifdef APP-PLUS  
        let _self = this;
        let id = '1.23452384164.123412415';
        if (plus.nativeObj.View.getViewById(id) !== null) {
                plus.nativeObj.View.getViewById(id).close();
        }
        let canvasInAppPlusContext = uni.createCanvasContext('watermarkCanvas');
        canvasInAppPlusContext.rotate(-30 * Math.PI / 180);
        canvasInAppPlusContext.setFontSize(24);
        canvasInAppPlusContext.setFillStyle('rgba(200, 200, 200, 0.50)');
        canvasInAppPlusContext.setTextAlign('left');
        canvasInAppPlusContext.setTextBaseline('middle');
        canvasInAppPlusContext.fillText(msg, -25, uni.upx2px(170));
        canvasInAppPlusContext.draw(false, function() {
            uni.canvasToTempFilePath({
                    canvasId: "watermarkCanvas",
                    success: function(res) {
                            _self.showWatermark = false;
                            let path = res.tempFilePath;

                    uni.getSystemInfo({
                            success: function(res) {
                                    console.log(res);
                                    //水印排列行数  
                                    let row = Math.floor(res.windowHeight / uni.upx2px(
                                            250));
                                    let tarArr = [];

                                    for (let i = 0; i < row; i++) {
                                        for (let j = 0; j < 3; j++) {
                                            tarArr.push({
                                                    tag: 'img',
                                                    src: path,
                                                    position: {
                                                            top: (uni.upx2px(255) * i) +
                                                                    'px',
                                                            left: (uni.upx2px(255) * j) + 30 +
                                                                    'px',
                                                            width: uni.upx2px(255) + 'px',
                                                            height: uni.upx2px(255) + 'px'
                                                    }
                                            });
                                        }
                                    }

                                    var watermarkView = new plus.nativeObj.View(id, {
                                            top: '70px',
                                            left: '0px',
                                            right: '0px',
                                            bottom: '50px',
                                            opacity:0.8
                                    }, tarArr);
                                    //拦截View控件的触屏事件,将事件穿透给下一层view  
                                    watermarkView.interceptTouchEvent(false);
                                    watermarkView.show();
                            }
                    });
                  }
            });
        });

        // #endif  
},
   }
        
}

代码地址：code.juejin.cn/pen/7415820…

不需要加水印的页面需要单独设置：

mounted() {
//检测是否存在view页，存在就显示
    if (plus.nativeObj.View.getViewById(this.viewId) !== null) {
            plus.nativeObj.View.getViewById(this.viewId).close();
    }
},