vue项目引入第三方js

以禁止浏览器打印功能为例，需要引入noprint.js
内容如下

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85

/* NoPrint.js V1.0 Created by PDFAntiCopy.com */ if (noCopy) { document.body.oncopy = function(){return false}; document.body.oncontextmenu = function(){return false}; document.body.onselectstart = document.body.ondrag = function(){ return false; } document.onkeydown = function() { if(event.ctrlKey == true && event.keyCode == 83) { event.preventDefault(); } } }   if (noPrint) { var c=document.createElement("span"); c.style.display="none"; c.style.postion="absolute"; c.style.background="#000"; var first=document.body.firstChild; var wraphtml=document.body.insertBefore(c,first); c.setAttribute('width', document.body.scrollWidth); c.setAttribute('height', document.body.scrollHeight); c.style.display="block"; var cssNode3 = document.createElement('style'); cssNode3.type = 'text/css'; cssNode3.media = 'print'; cssNode3.innerHTML ='body{display:none}'; document.head.appendChild(cssNode3); }   var cssNode2 = document.createElement('style'); cssNode2.type = 'text/css'; cssNode2.media = 'screen'; cssNode2.innerHTML ='div{-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}'; document.head.appendChild(cssNode2); document.body.style.cssText="-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;"; function toBlur() { if (autoBlur) document.body.style.cssText="-webkit-filter: blur(5px);-moz-filter: blur(5px);-ms-filter: blur(5px);-o-filter: blur(5px);filter: blur(5px);" }   function toClear() { document.body.style.cssText="-webkit-filter: blur(0px);-moz-filter: blur(0px);-ms-filter: blur(0px);-o-filter: blur(0px);filter: blur(0px);" }   document.onclick = function(event){ toClear(); }   document.onmouseleave = function(event){ toBlur(); }   document.onblur = function(event){ toBlur(); }   document.addEventListener('keyup', (e) => { if (e.key == 'PrintScreen') { if (noScreenshot) { navigator.clipboard.writeText('');   } } });   document.addEventListener('keydown', (e) => { if (e.ctrlKey && e.key == 'p') { if (noPrint) { e.cancelBubble = true; e.preventDefault(); e.stopImmediatePropagation(); } } });

　　

需要将该noprint.js改写，把上面所有代码包裹进export中，如下：

?

1 2 3

export function noprintMethod(noPrint,noCopy,noScreenshot，autoBlur){ // 这里是上面js 的所有代码 }

　　

vue组件中引入

?

1 2 3 4 5 6

import {noprintMethod} from ‘@js/noprint.’   mounted(){    noprintMethod(true,true,true,true) //传递四个参数 }