九宫格优化

zhiyangdu
1 parent 93fad796
Showing 2 changed files with 9 additions and 3 deletions
src/components/palaceGrid/palaceGrid.less
src/components/palaceGrid/palaceGrid.vue
@@ -12,21 +12,28 @@
                 display: flex;
                 align-items: center;
                 justify-content: center;
-                padding: 5px;
+                padding:0 5px;
                 box-sizing: border-box;
                 .img {
                     display: block;
                     width: 100%;
+                    height: 340px;
                 }
             }
             .two{
                 width: calc(calc(100% / 2));
                 margin-top: 10px;
+                .img {
+                    height: 340px;
+                }
             }
             .three{
                 width: calc(calc(100% / 3));
                 margin-top: 10px;
+                .img {
+                    height: 222px;
+                }
             }
 		}
 	}
@@ -5,7 +5,7 @@
                 <div class="item" v-if="grids.list.length==1" v-for="(item, index) in grids.list" :key="index" @click="jump(item)">
                     <img v-lazy="item.img" class="img" mode="widthFix" />
                 </div>
-                <div v-else :class="['item',grids.list.length%2==0 ? 'two':'three']">
+                <div v-else :class="['item',grids.list.length==2 || grids.list.length==4? 'two':'three']">
                     <img v-lazy="item.img" class="img" mode="widthFix" />
                 </div>
 			</div>
@@ -18,7 +18,6 @@
 		name: "palaceGrid",
         data: function () {
             return {
-
             }
         },
         props: ["grids"],