修改长图时的定位问题

src/components/Detail.vue

 <template>
 <template>
     <section class="detailWrap">
     <section class="detailWrap">
         <div v-if="pictureInfo">
         <div v-if="pictureInfo">
-            <div v-if="imgLock" class="imgBox">
-                <img :src="pictureInfo.image" alt>
+            <div v-if="imgLock" :class="['imgBox',top0]">
+                <img ref="picte" :src="pictureInfo.image" alt>
             </div>
             </div>
             <div v-else class="loadingBox">loading</div>
             <div v-else class="loadingBox">loading</div>
             <div class="userInfo">
             <div class="userInfo">
@@ -57,7 +57,8 @@ export default {
             dianzanLock: true,
             dianzanLock: true,
             jinzhidianzan: false,
             jinzhidianzan: false,
             imgLock: false,
             imgLock: false,
-            kongtuLock: false
+            kongtuLock: false,
+            top0: ''
         };
         };
     },
     },
     computed: {
     computed: {
@@ -442,11 +443,32 @@ export default {
                 // WeixinJSBridge.call("showOptionMenu"); // 显示右上角的三个点的选项
                 // WeixinJSBridge.call("showOptionMenu"); // 显示右上角的三个点的选项
             });
             });
         },
         },
+    },
+    watch: {
+        imgLock(newVal, oldVal) {
+            // 长图改变定位方式
+            if (newVal) {
+                setTimeout(() => {
+                    var imgHeight = Number(this.$refs.picte.clientHeight);
+                    var windowHeight = Number(document.body.clientHeight);
+                    if (imgHeight > 1.1 * windowHeight) {
+                        this.top0 = 'top0';
+                    } else {
+                        this.top0 = '';
+                    }
+                });
+            }
+        }
     }
     }
 };
 };
 </script>
 </script>
 
 
 <style lang="less" scoped>
 <style lang="less" scoped>
+.top0 {
+    top: 0 !important;
+    transform: translate(-50%, 0) !important;
+}
+
 .loadingBox {
 .loadingBox {
     color: white;
     color: white;
     font-size: 50px;
     font-size: 50px;

src/modules/js/api.js

 
 
-// // api地址
-// var server = 'http://web-comment.canskj.cn/new';
-// var extra = '8';
-
-// //包装的地址
-// var wrapHref = 'http://web-comment.canskj.cn/home/contest/h5/8';
-
-// //首页地址
-// var indexHref = 'http://web-comment.iyunfish.cn/home/contest/h5/8';
-// // 个人中心地址
-// var userCenterHref = 'http://web-comment.iyunfish.cn/home/contest/h5/newuser/8';
-
-// var shareImg = 'http://web-comment.iyunfish.cn/home/contest/h5/static/share1.jpg';
-
-
 // api地址
 // api地址
-var server = 'http://wd-h5.iyunfish.com/new';
+var server = 'http://web-comment.canskj.cn/new';
 var extra = '8';
 var extra = '8';
 
 
 //包装的地址
 //包装的地址
-var wrapHref = 'http://wd-h5.bdideal.com/home/contest/h5/8';
+var wrapHref = 'http://web-comment.canskj.cn/home/contest/h5/8';
 
 
 //首页地址
 //首页地址
-var indexHref = 'http://wd-h5.iyunfish.com/home/contest/h5/8';
+var indexHref = 'http://web-comment.iyunfish.cn/home/contest/h5/8';
 // 个人中心地址
 // 个人中心地址
-var userCenterHref = 'http://wd-h5.iyunfish.com/home/contest/h5/newuser/8';
+var userCenterHref = 'http://web-comment.iyunfish.cn/home/contest/h5/newuser/8';
+
+var shareImg = 'http://web-comment.iyunfish.cn/home/contest/h5/static/share1.jpg';
 
 
-var shareImg = 'http://wd-h5.iyunfish.com/home/contest/h5/static/share1.jpg';
 
 
 
 
 
 
+// // api地址
+// var server = 'http://wanda-qj.iyunfish.com/new';
+// var extra = '8';
+
+// //包装的地址
+// var wrapHref = 'http://wanda-qj.maxrocky.com/home/contest/h5/8';
+
+// //首页地址
+// var indexHref = 'http://wanda-qj.iyunfish.com/home/contest/h5/8';
+// // 个人中心地址
+// var userCenterHref = 'http://wanda-qj.iyunfish.com/home/contest/h5/newuser/8';
+
+// var shareImg = 'http://wanda-qj.iyunfish.com/home/contest/h5/static/share1.jpg';
+
+
 export default{
 export default{
     server,
     server,
     extra,
     extra,