'解决冲突'

src/pages/productQuery/product-detailed.vue

@@ -2,7 +2,7 @@
  * @Descrip: 产品明细
  * @Author: your name
  * @Date: 2019-10-15 14:30:00
- * @LastEditTime: 2019-11-06 10:36:40
+ * @LastEditTime: 2019-11-06 13:56:38
  * @LastEditors: Please set LastEditors
    -->
 <template>
@@ -23,7 +23,7 @@
     <!-- <Tab v-if="slide" :tabNums="tabNum" @getTabNum="getTabNum"/> -->
     <!-- 基本信息 -->
     <h-content v-swipeup="(e)=>vueTouch('上滑',e)" v-swipedown="(e)=>vueTouch('下滑',e)"  class="hcontent">
-      <scroll class="scrolls">
+      <scroll class="scrolls" ref="scrolls">
 
       <div id="baseInfo" class="base">
 
@@ -155,23 +155,33 @@ export default {
     }
   },
   methods:
+
       {
         // tab切换
         tabCheck (num) {
+          let scrollContent = document.getElementsByClassName('scrollContent')[0]
           if(num === 0){
             this.num = 0
+            console.log('基本信息',document.getElementsByClassName('base')[0].getBoundingClientRect().top)
+            this.height = document.getElementsByClassName('base')[0].getBoundingClientRect().top - 83
+            // console.log(height)
+            scrollContent.style.transition = 'all .3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
+            scrollContent.style.transform = 'translate(0px, -' + this.height + 'px) scale(1) translateZ(0px)'
 
           }else if(num === 1){
             this.num = 1
+            console.log('详情信息',document.getElementsByClassName('prodetail')[0].getBoundingClientRect().top)
+            this.height = document.getElementsByClassName('prodetail')[0].getBoundingClientRect().top - 83
+            console.log(this.height)
+            scrollContent.style.transition = 'all .3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
+            scrollContent.style.transform = 'translate(0px, -' + this.height + 'px) scale(1) translateZ(0px)'
           }else{
             this.num = 2
-            
-
             console.log('配置信息',document.getElementsByClassName('procnf')[0].getBoundingClientRect().top)
             this.height = document.getElementsByClassName('procnf')[0].getBoundingClientRect().top - 83
             // console.log(height)
-            document.getElementsByClassName('scrollContent')[0].style.transition = 'all .3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
-            document.getElementsByClassName('scrollContent')[0].style.transform = 'translate(0px, -' + this.height + 'px) scale(1) translateZ(0px)'
+            scrollContent.style.transition = 'all .3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s'
+            scrollContent.style.transform = 'translate(0px, -' + this.height + 'px) scale(1) translateZ(0px)'
           }
         },
         returnGo () {
@@ -183,7 +193,7 @@ export default {
         vueTouch: function (s, e) {
           // console.log(s, e)
           this.slide = true
-          this.height = 0
+          // this.height = 0
         //   document.getElementsByTagName('hcontent')[0].addEventListener('touchmove',function(e){
 		    //   console.log("开始滑动了touchstart");
 		    //   let a = document.documentElement.scrollTop;
@@ -194,11 +204,11 @@ export default {
           let procnfGather = document.getElementsByClassName('procnf')[0].getBoundingClientRect() // 配置信息元素集合
           let detailGather = document.getElementsByClassName('prodetail')[0].getBoundingClientRect() // 详情信息元素集合
           let baseGather = document.getElementsByClassName('base')[0].getBoundingClientRect() // 基本信息元素集合
-          if (clientHeight - procnfGather.top >= procnfGather.height) {
+          if (clientHeight - procnfGather.top - 83 >= procnfGather.height) {
             this.num = 2
-          } else if (clientHeight - detailGather.top >= detailGather.height) {
+          } else if (clientHeight - detailGather.top - 83 >= detailGather.height) {
             this.num = 1
-          } else if (clientHeight - baseGather.top >= baseGather.height) {
+          } else if (clientHeight - baseGather.top - 83 >= baseGather.height) {
             this.num = 0
           }
         },