| commit | author | age | ||
| 56a4b8 | 1 | <template> |
| aab811 | 2 | <div class="holdHeight"> |
| fc0c10 | 3 | <a-row type="flex" justify="center"> |
| 74344a | 4 | <a-col v-for="temp in [1,2,1,1,1,1]"> |
| fc0c10 | 5 | <div class="myCard" style="height: 200px;width: 220px; border-radius: 20px;"> |
| aab811 | 6 | <a-card :hoverable="true" size="small"> |
| I | 7 | <template slot="cover"> |
| 8 | <img class="myCardCover" alt="example" src="../../assets/mowenwei.jpg" /> | |
| 9 | </template> | |
| 56a4b8 | 10 | |
| aab811 | 11 | <template slot="actions" class="ant-card-actions"> |
| I | 12 | <a-icon key="arrowDown" type="arrow-down" /> |
| 13 | <a-icon key="edit" type="edit" /> | |
| 14 | <a-icon key="ellipsis" type="ellipsis" /> | |
| 15 | </template> | |
| 56a4b8 | 16 | |
| aab811 | 17 | <a-card-meta title="这世界那么多人" description="吉他谱 莫文蔚"> |
| I | 18 | </a-card-meta> |
| 19 | </a-card> | |
| 56a4b8 | 20 | </div> |
| aab811 | 21 | </a-col> |
| 56a4b8 | 22 | |
| aab811 | 23 | </a-row> |
| fc0c10 | 24 | <a-row type="flex" justify="center"> |
| ec97e0 | 25 | <div style="position:fixed;bottom: 10px;"> |
| fc0c10 | 26 | <a-pagination @change="onChange" :showQuickJumper="true" :size="size" v-model="current" |
| I | 27 | :defaultPageSize="10" :pageSize="pageSize" :total="total" /> |
| 28 | </div> | |
| 29 | </a-row> | |
| 56a4b8 | 30 | |
| I | 31 | </div> |
| 32 | ||
| 33 | </template> | |
| 34 | ||
| 35 | <script> | |
| 36 | export default { | |
| 37 | name: "box", | |
| 38 | data() { | |
| 39 | return { | |
| aab811 | 40 | data: [], |
| I | 41 | loading: false, |
| 42 | busy: false, | |
| 43 | size: "small", | |
| 44 | total: 50, | |
| 45 | pageSize: 10, | |
| 46 | current: 4, | |
| 56a4b8 | 47 | } |
| fc0c10 | 48 | }, |
| I | 49 | methods: { |
| 50 | onChange(current) { | |
| 51 | ||
| 52 | } | |
| 56a4b8 | 53 | } |
| I | 54 | } |
| 55 | </script> | |
| 56 | ||
| 57 | </script> | |
| 58 | ||
| 59 | <style lang="less"> | |
| aab811 | 60 | .holdHeight { |
| I | 61 | // background-color: beige; |
| fc0c10 | 62 | |
| aab811 | 63 | } |
| 56a4b8 | 64 | |
| aab811 | 65 | .myCard { |
| I | 66 | padding: 10px 10px; |
| 67 | } | |
| 68 | ||
| 69 | .myCardCover { | |
| 70 | object-fit: scale-down | |
| 71 | } | |
| 56a4b8 | 72 | </style> |
