1、在src目錄下面建立plugs/print.js檔案儲存外掛程式內容,其他位置也可print.js 檔案
// 列印類屬性、方法定義
/* eslint-disable */
const print = function (dom, options)
, options);if
((typeof dom)===
"string"
)else
this
.init()
;};print.prototype =
, extend: function (obj, obj2)
return obj;},
getstyle: function (
) str +="";
return str;},
gethtml: function (
)else
}else
if(inputs[k]
.type ==
"text"
)else
}for
(var k2 =
0; k2 < textareas.length; k2++)}
for(var k3 =
0; k3 < selects.length; k3++
)else}}
}}return
this
.dom.outerhtml;},
writeiframe: function (content)
,100)}
},toprint: function (framewindow)
}catch(e
) framewindow.
close()
;},10
);}catch
(err)}
, isdom:
(typeof htmlelement ==
='object')?
function (obj)
: function (obj)};
const myplugin =
myplugin.install = function (vue, options)
export default myplugin
2、main.js中引入外掛程式
3、vue檔案中使用
="show"
>
這是展示的需要列印的內容,給使用者看的。
<
/div>
"print"
class
="recordimg" id=
"tab_base"
>
這裡是需要列印的內容,出現在列印預覽的介面,這裡的樣式需要寫在 @media print 裡面 如果需要設定預覽頁規則,頁尾等樣式 @page
="no-print"
>不需要列印的內容<
/div>
="do-not-print-div"
>不要列印我<
/div>
"printcontext"
>列印<
/button>
<
/div>
...... method:
)//或 (這兩種寫法都可以)
//this.$print(this.$refs.print)
}// 不列印方法1. 新增no-print樣式類
// 不列印方法2. this.$print(this.$refs.print,)
}<
/script>
vue 引入原生js vue引入靜態js檔案的方法
由於一些演示,需要對編碼名稱等可快速進行修改,需要頁面方便配置。由於build後的vue專案基本已經看不出原樣,因此需要建立乙個檔案,並在打包的時候不會進行編譯。vue cli 2.0的作法是在static檔案下建立js。vue cli 3.0 的寫法則是直接在public資料夾下建立js 具體操作...
Vue中引入外部的js檔案
在使用threejs的時候,我需要用到乙個transformsvgpath 函式,這個函式是別人寫好了的。function transformsvgpath 我想用import的方法在vue元件中使用這個函式。1.引入乙個函式function transformsvgpath export 在需要引...
vue引入自己寫的js檔案
話不多說,直接上 呀 先來個結構圖 中規中矩的vue cli就寫了乙個自己的js檔案 那麼我想要引入到vue元件裡。1.首先寫我的js檔案 2.引入到vue元件!一定要用 把方法名拿過來 3.可以開心使用了 關於引入第三方外掛程式 簡單的說一下三種方式 一.可以cdn直接引入到index.html裡...