src/components/mini/box-friend.vue

@@ -1,25 +1,44 @@
<template>
   <div class="myFriend">
      <h1>朋友们</h1>
      <hr>
      <div class="link-box">
         <!-- <a href="#" target="_blank" class="no-underline"> -->
         <a href="#" class="no-underline" v-for="temp in [1,2,1,1,1,1,1,1,1]">
            <div class="thumb">
               <img width="200" height="200" src="https://cdn.jsdelivr.net/gh/Musenxi/CDN/长野.jpg" alt="长野 の BLOG">
            </div>
            <div class="content">
               <p class="title">
                  长野 の BLOG
               </p>
            </div>
         </a>
      <div v-for="temp in list">
         <h1>{{temp.groupName}}</h1>
         <hr>
         <div class="link-box"  >
            <!-- <a href="#" target="_blank" class="no-underline"> -->
            <a :href="listTemp.url" target="_blank" class="no-underline" v-for="listTemp in temp.linkVoList">
               <div class="thumb">
                  <img width="200" height="200" 
                   :src="listTemp.avatar" :onerror="img404" 
                     :alt="listTemp.name">
               </div>
               <div class="content">
                  <p class="title">
                     {{listTemp.name}}
                  </p>
               </div>
            </a>
         </div>
      </div>
   </div>
</template>

<script>
   export default {}
   import {
      queryBlogLinkGroup
   } from '../../api/blogLink.js'
   export default {
      created() {
         queryBlogLinkGroup().then((res) => {
            this.list = res.data;
         })
      },
      data() {
         return {
            img404:"this.onerror='';this.src=\"https://blog.zeruns.tech/tx.jpg\"",
            list: []
         }
      }
   }
</script>

</script>