better-scroll实现横向和纵向双向滚动

因项目需要，要实现横向和纵向双向滚动的功能，自己手写了一个结果ios和android不兼容。。。

后来发现大神的better-scroll可以实现，但也是频频踩坑，这几个配置间有冲突，搞不好还不能实现双向滚动，结果要加班，哈哈

那接下来就总结一下我实践成功的方法，先看效果图

---

开始讲解

环境和版本

这个是在vue中自己封装的组件

"vue": "^2.5.2",
"better-scroll": "^1.15.2",

组件

核心js

样式: 用的是stylus，用之前请安装stylus,否则会报错哈，具体安装使用就不介绍了

这个组件也可以当页面之间运行，重点说一下

eventPassthrough 的值是’vertical’,而不是 ‘horizontal’。
freeScroll、scrollX、eventPassthrough（horizontal）都是支持横向滚动，但是彼此之间会互斥。
所以只要设置这两个就行了： scrollX: true, eventPassthrough: “vertical”

好了，到此总结完毕，如果帮你出坑了，请点个赞哈