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
86
87
88
89
90
91
92
93
| <template>
| <div style="width:400px">
| <el-button type="primary" @click="handleExcel">下载 excel</el-button>
| <el-button type="success" @click="handleExcel1">下载 多级表头excel</el-button>
| </div>
|
| </template>
|
| <script>
| export default {
| name: 'HelloWorld',
| data(){
| return {}
| },
| methods: {
| handleExcel() {
| let opt = {
| title: '文档标题',
| column: [{
| label: '标题',
| prop: 'title'
| }],
| data: [{
| title: "测试数据1"
| }, {
| title: "测试数据2"
| }]
| }
| console.log(this.$Export);
| this.$Export.excel({
| title: opt.title ,
| columns: opt.column,
| data: opt.data
| });
| },
| handleExcel1() {
| let opt = {
| title: '文档标题',
| column: [{
| label:'多级表头',
| prop:'header',
| children:[
| {
| label: '标题1',
| prop: 'title1'
| },{
| label: '标题2',
| prop: 'title2'
| }
| ]
| }],
| data: [{
| title1: "测试数据1",
| title2: "测试数据2"
| }, {
| title1: "测试数据2",
| title2: "测试数据2"
| }]
| }
| this.$Export.excel({
| title: opt.title,
| columns: opt.column,
| data: opt.data
| });
| }
| },
|
| props: {
| msg: String
|
|
| }
| }
| </script>
|
| <!-- Add "scoped" attribute to limit CSS to this component only -->
| <style scoped>
| h3 {
| margin: 40px 0 0;
| }
| ul {
| list-style-type: none;
| padding: 0;
| }
| li {
| display: inline-block;
| margin: 0 10px;
| }
| a {
| color: #42b983;
| }
| </style>
|
|
|
