各种页面中添加水印，vue添加水印

/* 添加水印函数addWaterMarker   str:水印显示的文本内容 */

function addWaterMarker(str){

var can=document.createElement('canvas');

//水印显示的背景容器

var body=document.body;

body.appendChild(can);

can.width=400;

can.height=200;

can.style.display='none';

varcans=can.getContext('2d');

cans.rotate(-20*Math.PI/180);//倾斜角度

cans.font="16px Microsoft JhengHei";//字体

cans.fontSize='35px';//水印字体大小

cans.fillStyle='#cc0000';//字体颜色

cans.textAlign='left';

cans.textBaseline='Middle';

can.alpha='0.1';//透明度

cans.fillText(str,can.width/3,can.height/2);

body.style.backgroundImage="url("+can.toDataURL("image/png")+")";

}

addWaterMarker('显示水印')；

在vue中使用方法

方法一：在需要使用的页面，直接使用上面函数

方法二：可以建一个js,将函数导出，在需要的页面再进行导入