fix: h5环境previewImage左右滑动时触发浏览器前进、后退

NervJS · Dec 17, 2019 · f5d1957 · f5d1957
1 parent 2cb9e47
commit f5d1957
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/packages/taro-h5/src/api/image/react-wx-images-viewer/components/ImageContainer.js b/packages/taro-h5/src/api/image/react-wx-images-viewer/components/ImageContainer.js
@@ -192,8 +192,8 @@ class ImageContainer extends PureComponent {
 
   handleTouchStart = (event) => {
     // console.info('handleTouchStart')
-    // event.preventDefault()
-    // event.stopPropagation()
+    event.preventDefault()
+    event.stopPropagation()
     if (this.animationID) {
       raf.cancel(this.animationID)
     }
@@ -240,8 +240,8 @@ class ImageContainer extends PureComponent {
   }
 
   handleTouchMove = (event) => {
-    // event.preventDefault()
-    // event.stopPropagation()
+    event.preventDefault()
+    event.stopPropagation()
 
     switch (event.touches.length) {
       case 1: {

diff --git a/packages/taro-h5/src/api/image/react-wx-images-viewer/components/WxImageViewer.css b/packages/taro-h5/src/api/image/react-wx-images-viewer/components/WxImageViewer.css
@@ -4,6 +4,9 @@
   top: 0;
   width: 100%;
   height: 100%;
+  touch-action: none;
+  -ms-touch-action: none;
+  /* touch-action: pan-y pinch-zoom; */
 }
 .wx-image-viewer .viewer-cover {
   position: absolute;