使用vuejs2调用jspdf
如何使用vuejs调用jsPDF javascript使用vuejs2调用jspdf,vuejs2,jspdf,Vuejs2,Jspdf,如何使用vuejs调用jsPDF javascript var doc = new jsPDF(); var specialElementHandlers = { '#editor': function (element, renderer) { return true; } }; 首先,您可以为js pdf创建自定义指令(Vue.directive) 例如 现在,您可以将此文件包括在index.html文件中,还可以包括jsPDF库 <script src="htt
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function (element, renderer) {
return true;
}
};
首先,您可以为js pdf创建自定义指令(
Vue.directive
)
例如现在,您可以将此文件包括在index.html文件中,还可以包括jsPDF库
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.debug.js"></script>
<script src="<your public directory path>/js_pdf.js"></script>
接下来,可以对元素使用此指令
前
//这里的“v-js-pdf”是我们的自定义指令
目前,我已经添加了隐藏字段并获取静态值,但您可以根据需要添加动态值,也可以根据需要获取任何其他html元素
Vue.directive('js-pdf', {
twoWay: true,
priority: 1000,
deep: true,
params: ['pdfvalue', "pdfname"], //Add your require variable
paramWatchers: {
},
bind: function () {
//As per your wish you can set condition
var self = this;
setTimeout(function () {
var doc = new jsPDF()
doc.text(self.params.pdfvalue, 10, 10)
doc.save(self.params.pdfname + '.pdf');
}, 10);
},
update: function (value) {
//As per your requirement you can change data on update method
var self = this;
setTimeout(function () {
}, 10);
},
unbind: function () {
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.debug.js"></script>
<script src="<your public directory path>/js_pdf.js"></script>
<input type="hidden" id="editor" v-js-pdf pdfvalue="Hello world how are" pdfname="document">//Here "v-js-pdf" is our custom directive