SOURCE

let imgArr = document.getElementsByClassName('long_img')[0];
let imgBox = document.getElementsByClassName('img_box')[0];
let imgWidth = 0;
let imgHeight = 0;
let longImgIndexs = [];
let flag = true;

$('.imgggg').click(() => {
  if (flag) {
    $('.photo_swipe').show();
    showPic();
  } else {
    $('.photo_swipe').hide();
  }
})

function showPic() {
  setTimeout(() => {
    imgWidth = imgArr.width;
    imgHeight = imgArr.height;
    longImgClass();
    console.oldLog('settimeout', imgHeight)
  }, 50)

imgArr.onload = function () {
  imgWidth = this.width;
  imgHeight = this.height;
  longImgClass();
  alert('load' + imgHeight)
}

function longImgClass() {
  if (imgHeight > window.innerHeight) {
  	if (!longImgIndexs.includes(1)) {
      longImgIndexs.push(1)
    }
  } else {
    if (longImgIndexs.includes(1)) {
      longImgIndexs.splice(1, 1)
    }
  }
}

imgBox.addEventListener('touchmove', function(e) {
  console.oldLog($('.img_box').scrollTop())
  if (!longImgIndexs.includes(1)) {
    alert(1)
    e.stopPropagation();
    e.preventDefault();
  }
})
}

 <img data-v-16bfdafb="" src="http://u.thsi.cn/imgsrc/iwencai/8fad37ef9b004a074bf368a9ba862065.png" class="imgggg">

<div data-v-16bfdafb="" class="photo_swipe" style="opacity: 1;">
  <div data-v-16bfdafb="" class="img_body">
    <ul data-v-16bfdafb="" class="img_list" style="width: 400px; left: 0px;">
      <li data-v-16bfdafb="">
        <div data-v-16bfdafb="" class="img_box">
          <img data-v-16bfdafb="" src="http://u.thsi.cn/imgsrc/iwencai/8fad37ef9b004a074bf368a9ba862065.png" class="long_img">
        </div>
      </li>
    </ul>
  </div>
</div>

.aaaaa{
  width: 100%;
  word-break: break-all;
}
body,html{
  height: 100%;
}
body,html,img,ul,li{
  padding: 0;
  margin: 0;
  list-style: none;
}
.photo_swipe {
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #1a1a1a;
    z-index: 99;
    transition: opacity .2s;
  opacity: 1;
  display: none;
}

.img_body {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.img_list {
  width: 400px;
    left: 0px;
    position: relative;
    white-space: nowrap;
    height: 100%;
    display: flex;
    display: -webkit-flex;
}
.img_list li {
    height: 100%;
    display: inline-block;
}
.img_box {
    width: 100%;
    height: 100%;
    display: flex;
    display: -webkit-flex;
    align-items: center;
    -webkit-align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    overflow: auto;
}
.img_body img{
    width: 414px;
    transition: -webkit-transform .2s ease-out;
    transition: transform .2s ease-out;
    transition: transform .2s ease-out,-webkit-transform .2s ease-out;
      vertical-align: middle;
    border: 0;
}
.img_body .long_img[data-v-16bfdafb] {
    align-self: flex-start;
    -webkit-align-self: flex-start;
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
}

.imgggg{
  width: 100px;
}