🎈 perf(组件): 选择幼儿园组件事件回调触发点调整

 <template>
 <template>
   <div class="wrapper">
   <div class="wrapper">
     <div class="w-image">
     <div class="w-image">
-      <van-image v-if="avatar" class="van-hairline--surround" round width="3.8rem" height="3.8rem" lazy-load :src="avatar" style="position: absolute; left: 0.1rem; top: 0.1rem;" >
-        <template v-slot:error>加载失败</template>
-      </van-image>
-      <van-image v-else class="van-hairline--surround" round width="3.8rem" height="3.8rem" lazy-load :src="icon_avatar" style="position: absolute; left: 0.1rem; top: 0.1rem;" >
-        <template v-slot:error>加载失败</template>
+      <van-image class="van-hairline--surround avatar" round lazy-load :src="avatar ? avatar : icon_avatar">
+        <template #error>加载失败</template>
       </van-image>
       </van-image>
     </div>
     </div>
-    <div class="text-wrapper" @click="handle">
-      <van-row align="center" justify="center" style="position: relative; top: 50%; transform: translateY(-50%);">
-        <van-col span="20" style="color: #713610;"><slot></slot></van-col>
-        <van-col span="4" style="text-align: center;"><van-icon name="arrow" color="#c5c5c5" size="1.25rem" /></van-col>
+    <div class="text-wrapper">
+      <van-row align="center" justify="center" class="center-content">
+        <van-col span="20" style="color: #713610;">
+          <slot />
+        </van-col>
+        <van-col span="4" style="text-align: center;" @click="handle">
+          <van-icon name="arrow" color="#c5c5c5" size="1.25rem" />
+        </van-col>
       </van-row>
       </van-row>
     </div>
     </div>
   </div>
   </div>
@@ -20,38 +21,21 @@
 <script setup>
 <script setup>
 import icon_avatar from '@images/que-logo@2x.png'
 import icon_avatar from '@images/que-logo@2x.png'
 
 
-import { ref, reactive, onMounted } from 'vue'
+// eslint-disable-next-line no-unused-vars
 const props = defineProps({
 const props = defineProps({
-  avatar: String
+  avatar: {
+    type: String,
+    default: ''
+  }
 })
 })
-const emit = defineEmits(['on-click']);
+const emit = defineEmits(['on-icon-click']);
 const handle = () => {
 const handle = () => {
-  emit('on-click', '')
-}
-
-  onMounted(() => {
-    
-  })
-</script>
-
-<script>
-export default {
-  data () {
-    return {
-
-    }
-  },
-  mounted () {
-
-  },
-  methods: {
-
-  }
+  emit('on-icon-click', '')
 }
 }
 </script>
 </script>
 
 
 <style lang="less" scoped>
 <style lang="less" scoped>
-  .wrapper {
+.wrapper {
   position: relative;
   position: relative;
   background-color: #fff;
   background-color: #fff;
   margin: 2rem;
   margin: 2rem;
@@ -59,6 +43,7 @@ export default {
   margin-left: 4rem;
   margin-left: 4rem;
   height: 4rem;
   height: 4rem;
   box-shadow: 0px 0px 4px 0px rgba(73, 156, 255, 0.2);
   box-shadow: 0px 0px 4px 0px rgba(73, 156, 255, 0.2);
+
   .w-image {
   .w-image {
     width: 4rem;
     width: 4rem;
     height: 4rem;
     height: 4rem;
@@ -66,12 +51,24 @@ export default {
     background-color: #FFF;
     background-color: #FFF;
     position: absolute;
     position: absolute;
     left: -2rem;
     left: -2rem;
+
+    .avatar {
+      position: absolute;
+      left: 0.1rem;
+      top: 0.1rem;
+      width: 3.8rem;
+      height: 3.8rem;
+    }
   }
   }
+
   .text-wrapper {
   .text-wrapper {
     height: 100%;
     height: 100%;
     text-align: left;
     text-align: left;
     // line-height: 4rem; 
     // line-height: 4rem; 
     padding-left: 3rem;
     padding-left: 3rem;
+    .center-content{
+      position: relative; top: 50%; transform: translateY(-50%);
     }
     }
   }
   }
+}
 </style>
 </style>

@@ -5,9 +5,11 @@
       <template v-for="(item, key) in schoolList" :key="key">
       <template v-for="(item, key) in schoolList" :key="key">
         <right-side-list 
         <right-side-list 
           :avatar="item.logo"
           :avatar="item.logo"
-          @on-click="go('/client/chooseBook', { kg_id: item.id })" 
+          @on-icon-click="go('/client/chooseBook', { kg_id: item.id })" 
         > 
         > 
+          <span @click="go('/client/chooseBook', { kg_id: item.id })">
             {{ item.name }}
             {{ item.name }}
+          </span>
         </right-side-list>
         </right-side-list>
       </template>
       </template>
     </div>
     </div>