news

src/components/News.vue

@@ -4,15 +4,15 @@
     <div class="card_wrap">
       <div class="card" v-for="(item, index) in newsList" :key="item.id">
         <div :class="activeTab == item.id ? 'header active' : 'header'">
-          <div class="wrap">
+          <div class="wrap" @click="changeActiveWrap(item.id)">
             <img class="icon" :src="item.icon" />
             <p class="font">{{ item.title }}</p>
           </div>
         </div>
-        <img class="img" :src="item.list[index].pic" />
+        <img class="img" :src="getList()[index].pic" />
         <div class="bottom">
-          <p class="title">{{ item.list[index].productTitle }}</p>
-          <p class="desc">{{ item.list[index].desc }}</p>
+          <p class="title">{{ getList()[index].productTitle }}</p>
+          <p class="desc">{{ getList()[index].desc }}</p>
         </div>
       </div>
     </div>
@@ -24,6 +24,14 @@ import HeadLine from 'cpns/HeadLine'
 import { newsList } from '@/mock'
 import { ref } from 'vue'
 const activeTab = ref(1)
+const changeActiveWrap = id => {
+  activeTab.value = id
+}
+
+const getList = () => {
+  const arr = newsList.filter(item => item.id == activeTab.value)
+  return arr[0].list
+}
 </script>
 
 <style lang="scss" scoped>

src/components/Top.vue

@@ -55,7 +55,6 @@ const scrollToTop = () => {
     window.pageYOffset ||
     document.documentElement.scrollTop ||
     document.body.scrollTop
-  console.log(scrollTop)
   if (scrollTop == 0) {
     istop.value = true
   } else {