Vant-Picker 选择器PC不支持鼠标滚轮滚动操作(已解决)

这里记录下,魔改vant 的Picker 选择器 插件的过程:

因为Picker 选择器这个在pc上访问只能点击来选，并不能鼠标滚动滚轮来选择。

demo 请狠狠的点这里: https://download.lllomh.com/cliect/#/product/E719725902358605

 

 1，在node_modules 中找到 vant目录。再进入里面的es目录， 注意是 es里面的 不是在 lib中

 

要改的就是这个

找到本事 li 中的事件：

在 genOptions：function中 加上

 

        wheel:function wheel(e) {
              let evt = e || window.event;
              evt.preventDefault();
              let inindata=_this3.initialOptions.length-1
              if( evt.deltaY>0 ){
                if(Number(document.getElementsByClassName('van-picker-column__wrapper')[0].getAttribute('three'))==-(44*inindata-66)){
                  return false
                }else {
                  _this3.onClickItem(index);
                  _this3.altitude=_this3.altitude-44
                }
                console.info("向下滚动");
              }else{
                if(_this3.altitude==66){
                  return false
                }else{
                  _this3.onClickItem(index);
                  _this3.altitude=_this3.altitude+44

                }

                console.info("向上滚动");
              }
            }

记得加上变量： 这里原本是在 computed 加的， 换到data中：

 

    baseOffset: function baseOffset() {
      return this.altitude;
    }

 到这里就魔改完了，记得版本是   "vant": "^2.12.10",vant 毕竟是移动框架,电脑端不怎么适配! 只有自己上了!