mescroll-comp.js 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. /**
  2. * mescroll-body写在子组件时,需通过mescroll的mixins补充子组件缺少的生命周期
  3. */
  4. const MescrollCompMixin = {
  5. // 因为子组件无onPageScroll和onReachBottom的页面生命周期,需在页面传递进到子组件 (一级)
  6. onPageScroll(e) {
  7. this.handlePageScroll(e)
  8. },
  9. onReachBottom() {
  10. this.handleReachBottom()
  11. },
  12. // 当down的native: true时, 还需传递此方法进到子组件
  13. onPullDownRefresh(){
  14. this.handlePullDownRefresh()
  15. },
  16. data() {
  17. return {
  18. mescroll: { // mescroll-body写在子子子...组件的情况 (多级)
  19. onPageScroll: e=>{
  20. this.handlePageScroll(e)
  21. },
  22. onReachBottom: ()=>{
  23. this.handleReachBottom()
  24. },
  25. onPullDownRefresh: ()=>{
  26. this.handlePullDownRefresh()
  27. }
  28. }
  29. }
  30. },
  31. methods:{
  32. handlePageScroll(e){
  33. let item = this.$refs["mescrollItem"];
  34. if(item && item.mescroll) item.mescroll.onPageScroll(e);
  35. },
  36. handleReachBottom(){
  37. let item = this.$refs["mescrollItem"];
  38. if(item && item.mescroll) item.mescroll.onReachBottom();
  39. },
  40. handlePullDownRefresh(){
  41. let item = this.$refs["mescrollItem"];
  42. if(item && item.mescroll) item.mescroll.onPullDownRefresh();
  43. }
  44. }
  45. }
  46. export default MescrollCompMixin;