pcb搜索框悬浮

layouts/pcb.vue

@@ -1,7 +1,7 @@
 <template>
   <div id="main">
     <header-view v-if="!isInFrame"></header-view>
-    <main-header :isPcb="true"></main-header>
+    <main-header :isPcb="true" :isFixed="isFixed"></main-header>
     <main-nav></main-nav>
     <nuxt/>
     <footer-view></footer-view>
@@ -13,6 +13,11 @@
   import { MainHeader, MainNav } from '~components/main'
   export default {
     name: 'pcb',
+    data () {
+      return {
+        isFixed: false
+      }
+    },
     components: {
       HeaderView: Header,
       FooterView: Footer,
@@ -20,6 +25,18 @@
       MainHeader,
       MainNav
     },
+    mounted () {
+      this.$nextTick(() => {
+        window.addEventListener('scroll', () => {
+          let obj = document.querySelector('#headerWrapperContent')
+          let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
+          // 写死是因为获取不到
+          if (obj) {
+            this.isFixed = scrolled >= obj.offsetTop
+          }
+        }, false)
+      })
+    },
     head () {
       return {
         title: this.title || '【优软商城】IC电子元器件现货采购交易平台商城',