Vue页面转pdf功能实现

**需求:**不通过后台,仅用vue将页面转为pdf文件。

**使用插件:**vue-to-pdf

第一步:安装插件

bash 复制代码
npm install --save vue-to-pdf

第二步:main.js引入代码

javascript 复制代码
import vueToPdf from 'vue-to-pdf';
Vue.use(vueToPdf);

第三步:编写代码

javascript 复制代码
<template>
    <div ref="exportPDF">
        <h1>我是内容</h1>
        <el-button type="primary" @click="savePdf" v-preventReClick>转换pdf</el-button>
    </div>
</template>


<script>
export default {
    methods: {
	    savePdf(){ // 导出
		    this.$PDFSave(this.$refs.exportPDF, "pdf的文件名");
	    }
    }
</script>
相关推荐
子兮曰几秒前
后端字段又改了?我撸了一个 BFF 数据适配器,从此再也不怕接口“屎山”!
前端·javascript·架构
万少2 小时前
使用Trae轻松安装openclaw的教程-附带免费token
前端·openai·ai编程
浪浪山_大橙子2 小时前
OpenClaw 十分钟快速,安装与接入完全指南 - 推荐使用trae 官方 skills 安装
前端·人工智能
忆江南2 小时前
iOS 可视化埋点与无痕埋点详解
前端
离开地球表面_992 小时前
金三银四程序员跳槽指南:从简历到面试再到 Offer 的全流程准备
前端·后端·面试
_柳青杨2 小时前
跨域获取 iframe 选中文本?自己写个代理中间层,再也不求后端!
前端
比尔盖茨的大脑2 小时前
事件循环底层原理:从 V8 引擎到浏览器实现
前端·javascript·面试
天才熊猫君2 小时前
Vue3 命令式弹窗原理和 provide/inject 隔离机制详解
前端
bluceli2 小时前
Vue 3 Composition API深度解析:构建可复用逻辑的终极方案
前端·vue.js
程序员ys2 小时前
前端权限控制设计
前端·vue.js·react.js