Commit 0a061a9d46d5ffc8fb2f0510fe30065680bb23fd

Authored by zhiyangdu
1 parent cc852a3f

九宫格

src/components/palaceGrid/palaceGrid.less
... ... @@ -14,6 +14,13 @@
14 14 justify-content: center;
15 15 padding:0 5px;
16 16 box-sizing: border-box;
  17 + position: relative;
  18 + .title{
  19 + position: absolute;
  20 + flex: 1;
  21 + font-size:28px;
  22 + color: #fff;
  23 + }
17 24 .img {
18 25 display: block;
19 26 width: 100%;
... ...
src/components/palaceGrid/palaceGrid.vue
... ... @@ -4,11 +4,12 @@
4 4 <div class="img-box" >
5 5 <div :class="['item',grids.list.length==1?'one':(grids.list.length==2 || grids.list.length==4? 'two':'three')]" v-for="(item, index) in grids.list" :key="index" @click="jump(item)">
6 6 <van-image
  7 + v-if="index<9"
7 8 class="img"
8 9 fit="cover"
9 10 :src="item.img || item"
10 11 />
11   - <!--<img v-lazy="item.img" mode="widthFix" />-->
  12 + <div v-if="grids.list.length>9 && index == 8" class="title">共{{grids.list.length}}张</div>
12 13 </div>
13 14 </div>
14 15 </div>
... ... @@ -20,19 +21,6 @@
20 21 name: "palaceGrid",
21 22 data: function () {
22 23 return {
23   -// grids:{
24   -// list:[
25   -// {img:'static/img/banner-02.jpg'},
26   -// {img:'static/img/banner-02.jpg'},
27   -// {img:'static/img/banner-02.jpg'},
28   -// {img:'static/img/banner-02.jpg'},
29   -// {img:'static/img/banner-02.jpg'},
30   -// {img:'static/img/banner-02.jpg'},
31   -// {img:'static/img/banner-02.jpg'},
32   -// {img:'static/img/banner-02.jpg'},
33   -// {img:'static/img/banner-02.jpg'}
34   -// ]
35   -// }
36 24 }
37 25 },
38 26 props: ["grids"],
... ...