资讯图片添加链接

assets/style/homePage.scss

@@ -131,7 +131,7 @@
                             width: 100px;
                             margin-right: 10px;
                         }
-                        a{
+                        .en-title-a{
                             overflow: hidden;
                             font-weight: bold;
                             text-overflow: ellipsis;
@@ -156,12 +156,15 @@
                     padding: 19px 0;
                     border-bottom: 1px solid #ccc;
                     width: 100%;
-                    img{
-                        width: 35%;
-                        height: 150px;
-                        border-radius: 10px;
-                        margin-right: 10px;
+                    .img-a{
+                            width: 35%;
+                        img{
+                            height: 150px;
+                            border-radius: 10px;
+                            margin-right: 10px;
+                        }
                     }
+                    
                     .content-text{
                         position: relative;
                         margin-left: 10px;
@@ -399,7 +402,7 @@
                                 img{
                                     height: 87.22px;
                                 }
-                                a{
+                                .img-a{
                                     font-size: 14px;
                                     line-height: 20px;
                                     height: 40px;

pages/content/index.vue

@@ -92,7 +92,7 @@
                           tag="a"
                           target="_blank"
                         >
-                          <img :src="item.path">
+                          <img :src="item.path" :alt="item.title">
                           <p class="line-two">{{item.title}}</p>
                         </nuxt-link>
                       </Col>

pages/index.vue

@@ -38,8 +38,8 @@
           <Row class="english">
             <Col :span="11" v-for="(item,index) in mainData[43]" :key="index">
             <div class="en-title">
-              <img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId">
-              <nuxt-link :to="{path: '/content', query:{id:item.infoId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.title}}</nuxt-link>
+              <nuxt-link :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank"><img v-lazy="picPath+item.infoimg" :alt="item.title" :key="item.infoId"></nuxt-link>
+              <nuxt-link class="en-title-a" :to="{path: '/content', query:{id:item.infoId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.title}}</nuxt-link>
             </div>
             </Col>
           </Row>
@@ -49,18 +49,18 @@
             <hr></hr>
           </div>
           <div class="content-item" v-for="item in focusNews">
-            <img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId">
+            <nuxt-link class="img-a" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank"><img v-lazy="picPath+item.infoimg" :alt="item.title" :key="item.infoId"></nuxt-link>
             <div class="content-text">
-              <nuxt-link :to="{path: '/content', query:{id:item.infoId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.title}}</nuxt-link>
+              <nuxt-link :to="{path: '/content', query:{id:item.infoId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.title}}</nuxt-link>
               <p style="-webkit-box-orient: vertical;">{{item.summary}}</p>
               <div class="source" v-if="item.columnname.includes('—')">
-                <nuxt-link :to="{path: '/lists', query:{id:item.parentcolumnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[0]}}</nuxt-link>
+                <nuxt-link :to="{path: '/lists', query:{id:item.parentcolumnId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[0]}}</nuxt-link>
                 <span>—</span>
-                <nuxt-link :to="{path: '/lists', query:{id:item.columnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[1]}}</nuxt-link>
+                <nuxt-link :to="{path: '/lists', query:{id:item.columnId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[1]}}</nuxt-link>
                 <span>/{{item.uptimeStr}}</span>
               </div>
               <div class="source" v-else>
-                <nuxt-link v-if="item.columnname" :to="{path: '/lists', query:{id:item.columnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname}}/</nuxt-link>
+                <nuxt-link v-if="item.columnname" :to="{path: '/lists', query:{id:item.columnId}}"  style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname}}/</nuxt-link>
                 <span>{{item.uptimeStr}}</span>
               </div>
             </div>
@@ -88,7 +88,7 @@
             <div class="column-content">
               <div class="column-video">
                 <nuxt-link class="iconfont icon-bofang" :to="{path: '/content', query:{id:mainData[3][0].infoId}}" tag="a" target="_blank">
-                  <img v-lazy="picPath+mainData[3][0].infoimg" alt="">
+                  <img v-lazy="picPath+mainData[3][0].infoimg" :alt="mainData[3][0].title.title">
                   <p class="line-one">{{mainData[3][0].title}}</p>
                 </nuxt-link>
               </div>
@@ -110,10 +110,9 @@
                   <Col :span="11" >
                   <div class="content-li" >
                     <nuxt-link class="iconfont icon-bofang" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank">
-                      <img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId">
+                      <img v-lazy="picPath+item.infoimg" :alt="item.title" :key="item.infoId">
                     </nuxt-link>
                   </div>
-
                   </Col>
                   <Col :span="11">
                   <div class="content-li" >
@@ -151,8 +150,8 @@
             <div class="column-content">
               <Row class="life">
                 <Col :span="11" v-for="(item,index) in lifeColumnData" :key="index">
-                <img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId">
-                <nuxt-link style="-webkit-box-orient: vertical;" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank">{{item.title}}</nuxt-link>
+                <nuxt-link :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank"><img v-lazy="picPath+item.infoimg" :alt="item.title" :key="item.infoId"></nuxt-link>
+                <nuxt-link class="img-a" style="-webkit-box-orient: vertical;" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank">{{item.title}}</nuxt-link>
                 </Col>
               </Row>
             </div>
@@ -169,7 +168,7 @@
             </div>
             <div class="column-content">
               <div class="cul-top">
-                <img v-lazy="picPath+mainData[41][0].infoimg" alt="">
+                <nuxt-link :to="{path: '/content', query:{id:mainData[41][0].infoId}}" tag="a" target="_blank"><img v-lazy="picPath+mainData[41][0].infoimg" :alt="mainData[41][0].title"></nuxt-link>
                 <nuxt-link :to="{path: '/content', query:{id:mainData[41][0].infoId}}" tag="a" target="_blank">{{mainData[41][0].title}}</nuxt-link>
               </div>
               <div class="culture">
@@ -246,53 +245,53 @@
                 <Row class="wiki">
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/kh.png" tag="a" target="_blank">柬埔寨</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/kh.png" tag="a" target="_blank" alt="柬埔寨">柬埔寨</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/bn.png" tag="a" target="_blank">文莱</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/bn.png" tag="a" target="_blank" alt="文莱">文莱</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/id.png" tag="a" target="_blank">印尼</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/id.png" tag="a" target="_blank" alt="印尼">印尼</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/sg.png" tag="a" target="_blank">新加坡</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/sg.png" tag="a" target="_blank" alt="新加坡">新加坡</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/vn.png" tag="a" target="_blank">越南</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/vn.png" tag="a" target="_blank" alt="越南">越南</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/mm.png" tag="a" target="_blank">缅甸</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/mm.png" tag="a" target="_blank" alt="缅甸">缅甸</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
 
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/ph.png" tag="a" target="_blank">菲律宾</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/ph.png" tag="a" target="_blank" alt="菲律宾">菲律宾</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/la.png" tag="a" target="_blank">老挝</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/la.png" tag="a" target="_blank" alt="老挝">老挝</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/th.png" tag="a" target="_blank">泰国</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/th.png" tag="a" target="_blank" alt="泰国">泰国</nuxt-link>
                   </li>
                   </Col>
                   <Col :span="8">
                   <li>
-                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/my.png" tag="a" target="_blank">马来西亚</nuxt-link>
+                    <nuxt-link :to="{path: '/lists', query:{id:5}}"><img src="~/assets/img/ten_icon/my.png" tag="a" target="_blank" alt="马来西亚">马来西亚</nuxt-link>
                   </li>
                   </Col>
                 </Row>

pages/lists/index.vue

@@ -4,18 +4,18 @@
             <Row>
                 <Col :span="15">
                     <div class="lists-item" v-for="item in listData">
-                        <img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId">
+                        <nuxt-link class="img-a" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank"><img v-lazy="picPath+item.infoimg" alt="" :key="item.infoId"></nuxt-link>
                         <div class="content-text">
-                            <nuxt-link class="line-one" style="-webkit-box-orient: vertical;" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank">{{item.title}}</nuxt-link>
+                            <nuxt-link style="-webkit-box-orient: vertical;" :to="{path: '/content', query:{id:item.infoId}}" tag="a" target="_blank">{{item.title}}</nuxt-link>
                             <p style="-webkit-box-orient: vertical;">{{item.summary}}</p>
                             <div class="source" v-if="item.columnname?item.columnname.includes('—'):false">
-                                <nuxt-link :to="{path: '/lists', query:{id:item.parentcolumnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[0]}}</nuxt-link>
+                                <nuxt-link :to="{path: '/lists', query:{id:item.parentcolumnId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[0]}}</nuxt-link>
                                 <span>—</span>
-                                <nuxt-link :to="{path: '/lists', query:{id:item.columnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[1]}}</nuxt-link>
+                                <nuxt-link :to="{path: '/lists', query:{id:item.columnId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname.split('—')[1]}}</nuxt-link>
                                 <span>/{{item.uptimeStr}}</span>
                             </div>
                             <div class="source" v-else>
-                                <nuxt-link v-if="item.columnname" :to="{path: '/lists', query:{id:item.columnId}}" class="line-one" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname}}/</nuxt-link>
+                                <nuxt-link v-if="item.columnname" :to="{path: '/lists', query:{id:item.columnId}}" style="-webkit-box-orient: vertical;" tag="a" target="_blank">{{item.columnname}}/</nuxt-link>
                                 <span>{{item.uptimeStr}}</span>
                             </div>
                         </div>
@@ -210,11 +210,13 @@ export default {
         padding: 19px 0;
         border-bottom: 1px solid #ccc;
         width: 100%;
-        img{
-            width: 35%;
-            height: 150px;
-            border-radius: 10px;
-            margin-right: 10px;
+        .img-a{
+                width: 35%;
+            img{
+                height: 150px;
+                border-radius: 10px;
+                margin-right: 10px;
+            }
         }
         .content-text{
           position: relative;