5
5
</template >
6
6
7
7
<script >
8
+ // this demonstrate with buttons and responsive master/details row
8
9
import VdtnetTable from ' ../src'
9
10
import ' datatables.net-bs4'
10
11
11
- /*
12
- // you can import these if needed
13
- // this import all buttons that we need
14
- import 'datatables.net-buttons/js/dataTables.buttons.js';
15
- import 'datatables.net-buttons/js/buttons.html5.js';
16
- import 'datatables.net-buttons/js/buttons.print.js';
17
- import 'datatables.net-responsive/js/dataTables.responsive.js';
12
+ // import buttons
13
+ import ' datatables.net-buttons/js/dataTables.buttons.js'
14
+ import ' datatables.net-buttons/js/buttons.html5.js'
15
+ import ' datatables.net-buttons/js/buttons.print.js'
16
+ import ' datatables.net-responsive/js/dataTables.responsive.js'
18
17
19
18
// import the rest
20
19
import ' datatables.net-buttons-bs4'
21
20
import ' datatables.net-responsive-bs4'
22
- import 'datatables.net-fixedheader-bs4'
23
- import 'datatables.net-scroller-bs4';
24
- import 'datatables.net-select-bs4';
25
21
26
- import 'datatables.net-bs4/css/dataTables.bootstrap4.min.css';
27
- import 'datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css';
28
- import 'datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css';
29
- import 'datatables.net-scroller-bs4/css/scroller.bootstrap4.min.css';
30
- import 'datatables.net-select-bs4/css/select.bootstrap4.min.css';
31
- */
22
+ import ' datatables.net-bs4/css/dataTables.bootstrap4.min.css'
23
+ import ' datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css'
24
+ import ' datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css'
25
+
32
26
export default {
33
27
name: ' app' ,
34
28
components: { VdtnetTable },
@@ -40,7 +34,6 @@ export default {
40
34
ajax: {
41
35
url: ' https://jsonplaceholder.typicode.com/users' ,
42
36
dataSrc : (json ) => {
43
- // console.log(json)
44
37
return json
45
38
}
46
39
},
@@ -52,7 +45,8 @@ export default {
52
45
ordering: true ,
53
46
lengthChange: true ,
54
47
serverSide: true ,
55
- fixedHeader: true
48
+ fixedHeader: true ,
49
+ buttons: [' copy' , ' csv' , ' print' ]
56
50
},
57
51
fields: {
58
52
id: { label: ' ID' , sortable: true },
0 commit comments