質問編集履歴

1

修正

2019/03/05 09:01

投稿

_Victorique__
_Victorique__

スコア1392

test CHANGED
File without changes
test CHANGED
@@ -17,133 +17,3 @@
17
17
  これは仕様なのでしょうか?予めitemsをセットしておく必要があるのでしょうか?
18
18
 
19
19
  リアクティブにはできないのでしょうか?
20
-
21
-
22
-
23
- ```vue
24
-
25
- <script>
26
-
27
- export default {
28
-
29
- props: {
30
-
31
- items: {
32
-
33
- type: Array,
34
-
35
- required: true
36
-
37
- }
38
-
39
- },
40
-
41
- data () {
42
-
43
- return {
44
-
45
- pagination: {
46
-
47
- },
48
-
49
- headers: [
50
-
51
- {
52
-
53
- text: 'ファイル名',
54
-
55
- align: 'left',
56
-
57
- sortable: false,
58
-
59
- value: 'name'
60
-
61
- },
62
-
63
- { text: '最終更新日', value: 'modifyDate' },
64
-
65
- { text: 'ファイルサイズ (KB)', value: 'size' }
66
-
67
- ]
68
-
69
- }
70
-
71
- },
72
-
73
- computed: {
74
-
75
- pages () {
76
-
77
- console.log(this.pagination.rowsPerPage)
78
-
79
- console.log(this.pagination.totalItems)
80
-
81
- if (this.pagination.rowsPerPage == null ||
82
-
83
- this.pagination.totalItems == null
84
-
85
- ) return 0
86
-
87
- return Math.ceil(this.pagination.totalItems / this.pagination.rowsPerPage)
88
-
89
- }
90
-
91
- }
92
-
93
- }
94
-
95
- </script>
96
-
97
-
98
-
99
- <template>
100
-
101
- <div>
102
-
103
- <v-data-table
104
-
105
- :headers="headers"
106
-
107
- :items="items"
108
-
109
- hide-actions
110
-
111
- :pagination.sync="pagination"
112
-
113
- class="elevation-1"
114
-
115
- >
116
-
117
- <template slot="no-data">
118
-
119
- <div>
120
-
121
- No files
122
-
123
- </div>
124
-
125
- </template>
126
-
127
- <template slot="items" slot-scope="props">
128
-
129
- <td>{{ props.item.name }}</td>
130
-
131
- <td class="text-xs-right">{{ props.item.modifyDate }}</td>
132
-
133
- <td class="text-xs-right">{{ props.item.size }}</td>
134
-
135
- </template>
136
-
137
- </v-data-table>
138
-
139
- <div class="text-xs-center pt-2">
140
-
141
- <v-pagination v-model="pagination.page" :length="pages"></v-pagination>
142
-
143
- </div>
144
-
145
- </div>
146
-
147
- </template>
148
-
149
- ```