介绍
element-easy-print
element-easy-print 是一个基于 ElementPlus 的表单组件，可以通过JSON快速的生打印模板。
DragForm
安装 element-easy-print^1.0.4
element-easy-print
^1.0.4
npm install element-easy-print --save
1
element-easy-print
<template>
<div class="p20 h100 ">
<EasyPrint @handleSave="handleSave"/>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router";
import { useFullLoading } from "/@ts/hooks/fullLoading";
const { openLoading, closeLoading } = useFullLoading();
closeLoading()
const handleSave = (e:any)=>{
console.log('e :>> ', e);
}
const state: any = reactive({
activeDate: "",
});
</script>
<style lang="scss">
</style>
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
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
引入
import 'element-easy-print/dist/style.css'
import elementEasyPrint from 'element-easy-print'
Vue.use(elementEasyPrint)
1
2
3
2
3
EasyPrint 或 Preview 属性
| 属性名 | 说明 | 数据类型 | 默认值 |
|---|---|---|---|
| options | 数据 | Object | 参考下面 |
options默认值
{
"width": 210,//纸张尺寸 mm
"height": 297,//纸张尺寸 mm
"data": [],
"model": {}
}
1
2
3
4
5
6
2
3
4
5
6
element-easy-print 方法
| 方法名 | 说明 | 返回值 |
|---|---|---|
| handleSave | 返回当前JSON数据 | options |