H5-移動端-textarea無法滾動問題

一、項(xiàng)目說明

H5項(xiàng)目，采用技術(shù)為vue，頁面中使用的頁面滑動插件是better-scroll（better-scroll 是一款重點(diǎn)解決移動端（已支持 PC）各種滾動場景需求的插件）。

二、現(xiàn)象

在項(xiàng)目中，一個錄入信息的頁面中，使用了textarea，讓文本能滾動輸入或查看。在文本框中錄入了足夠多的文本以后，發(fā)現(xiàn)textarea無法滾動，滑動的時候，會觸發(fā)整個頁面的滾動，這樣這個就達(dá)不到我們頁面想要的效果了。

三、原因

原因就是因?yàn)樵谟|發(fā)textarea滑動的時候，產(chǎn)生了冒泡事件，引起了整個頁面的滑動，知道了原因以后就很好解決啦

四、解決

window.addEventListener('touchmove',function(e){
  let target = e.target
  if(target && target.tagName === 'TEXTAREA'){ 
    e.stopPropagation();
  }
},true)