插件： vue-touch的使用

https://github.com/vuejs/vue-touch/tree/next

在vue2.0中，npm install vue-touch@next

<v-touch></v-touch>------------------->需要设置css样式，定义宽高

<template>
  <transition name="fades" >
    <div id="bigImgPage" class="main-body" :style="{'-webkit-overflow-scrolling': scrollMode}">
      <div class="img-view" >
        <v-touch v-on:tap="bigImg1()" v-on:swipeup="bigImg()" v-on:swipedown="bigImg()" style="width:100%; height:100%;">
        <!-- 遮罩层 -->
        <div class="img-layer"></div>

        <!--<div class="img" v-bind:class="classArray">
          <img ref="bigPic" :src="curimgsrc" @load="checkHeight($event)" v-bind:style="{width: imgWidth + 'px'}">
        </div>-->
        <mt-swipe :auto="0" :continuous="false" :speed="100" :defaultIndex=enterIndex  ref="swipeWrapper" :showIndicators="false" @change="changeIndex">
          <mt-swipe-item v-for="(item, index) in srcList" :key="index"><div class="imgItem"><img :src="item"></div></mt-swipe-item>
        </mt-swipe>
        <div >
          <div class="pageinfo">{{curPage}} / {{totalPages}}</div>
          <div id="downloadBtn" class="downloadBlank" v-show="showpageinfo">
            <div class="downloadBtn" style="position: relative; top: 30px; height:28px; width:100%; vertical-align:middle; padding-top:12px; font-size:0.16rem;">保存图片</div>
          </div>
          <div id="downloadNote" class="downloadNote" v-if="showdownload">图片已保存到该设备</div>
        </div>
        <img id="getOriImg" :src="curimgsrc" style="display:none;">
        </v-touch>
      </div>
    </div>
  </transition>
</template>

import Vue from 'vue'
var VueTouch = require('vue-touch')
Vue.use(VueTouch, {name: 'v-touch'})

bigImg1: function () {
  var self = this
  self.clickCount++
  setTimeout(function(){
    if(self.clickCount === 1){-------------->处理单击事件
      self.bigImg()
      self.clickCount = 0
    }else if(self.clickCount === 2){-------->处理双击事件
      alert(self.clickCount)
      self.clickCount = 0
    }
  }, 300)
},

bigImg: function () {
  this.$emit('clickit')
},

<div class="mint-cell" v-if="manager">
  <router-link :to="{name: 'watchAddFence', params: { aId: item.fence_id, itemFenceName: formatTit[index], itemAddr: formatAddr[index], itemRange: item.radius, itemLng: item.lng, itemLat: item.lat, itemStatus: item.status }}" class="mint-cell-wrapper">
<v-touch tag="div" v-on:press="longPress(item.fence_id)" style="position: absolute;left: 10px;top: 0;z-index: 1;height: 17px;width: 100%;padding: 10px 0;">
 <div class="mint-cell-title">
<span class="mint-cell-text" v-model="item.fence_id">{{formatTit[index]}}</span>
<span class="mint-cell-label">{{item.radius}}米，{{formatAddr[index]}}</span>
 </div>
</v-touch>
  </router-link>
  <div class="mint-cell-value" v-on:click="js_btn_cell_value(index, $event)">
<mt-switch v-model="statusList[index]"  v-on:change="itemToggle(item.fence_id, item.status, index)"></mt-switch>
  </div>
</div>








var VueTouch = require('vue-touch')
Vue.use(VueTouch, {name: 'v-touch'})




longPress (aId) {
var self = this
self.fenceId = aId
self.deleDataItem()
},