产品多线条简化代码

src/components/common/ProductCard.vue

@@ -9,8 +9,8 @@
 
 <template>
   <!-- <div> -->
-  
-  
+
+
   <div class="roolsolt">
 
 
@@ -22,25 +22,12 @@
 
        <van-row type="flex" justify="center" >
                       <div class="lines" style="z-index: 1; position:absolute;  left:0px; width: 98%;margin:0 1%;margin-top: 1.5%;">
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
-        <div style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
- 
+        <div v-for="index in 12" :key="index" style="width: 100%; height: 5px; border-bottom: 1px silver solid;"></div>
+
       </div>
       </van-row>
-      
-  
+
+
       <van-row type="flex" justify="center" class="integral" >
         <van-col span="24" style="z-index:2; font-size: 36px;font-weight: 900; margin-top: 5%;">￥{{ productData.amtMax }}</van-col>
       </van-row>
@@ -55,9 +42,9 @@
       </van-row>
     </div>
     <div style="">
-        <scroller-view v-calculate-height  :height="10000" > 
+        <scroller-view v-calculate-height  :height="10000" >
       <van-collapse v-model="activeNames" v-if="this.productData.prodDesc!=undefined" style="
-   
+
     width: 100%;
     height: 100%;
     border-radius: 8px;
@@ -90,7 +77,7 @@ export default class ProductCard extends Vue {
 
   @Prop({ default: {prodDesc:""} }) productData: any | {};//产品数据
   @Prop({ default: {prodDesc:""} }) desc: any | {};//产品数据
-  
+
 
   //立即登录
   activeNames = [""];