vue的移動app項目中，自訂拖拽指令的問題

標籤：app   手機版   drag   func   offset   一個   元素   用法   自訂指令   

使用vue的都知道vue有一個自訂指令，我比較喜歡的就是拖拽的自訂指令，感覺挺方便的！

 //組件內的拖拽指令directives: {    //組建內自訂指令    drag: {      // 指令的定義      bind: function(el, value) {        let oDiv = el; //當前元素        let self = this; //上下文        oDiv.ontouchstart = function(e) {          //滑鼠按下，計算當前元素距離可視區的距離          let disX = e.touches[0].clientX - oDiv.offsetLeft;          let disY = e.touches[0].clientY - oDiv.offsetTop;          oDiv.style.zIndex = 3;                           document.ontouchmove = function(e) {            //通過事件委託，計算移動的距離            let l = e.touches[0].clientX - disX;            let t = e.touches[0].clientY - disY;            //移動當前元素            //   oDiv.style.left = l + ‘px‘;                                  document.ontouchend = function(e) {            oDiv.style.zIndex = 2;                       }            document.ontouchmove = null;            document.ontouchend = null;          };        };      }    }  }//大致的架構就是這樣其中el指的是綁定的元素，value就是傳的值了，

　　用法：

<div v-drag=‘{data:fills,info:data} ‘>拖拽</div><!--{}裡面的全部都是傳的參數，對應的就是上面的value-->

　　上面是拖拽指令的寫法及用法，但是這並不是主要內容，當你移動端使用自訂指令的時候，如果你的公司需要相容各種手機版本以及各種系統版本，那麼可能你就需要把他撤掉，我遇到的就是蘋果5s並不支援，如果用自訂的指令，那麼他會閃爍，沒有內容，是白屏狀態，所以說，想要用自訂指令的，要考慮考使用環境！

vue的移動app項目中，自訂拖拽指令的問題