mescroll-more-item.js 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. /**
  2. * mescroll-more-item的mixins, 仅在多个 mescroll-body 写在子组件时使用 (参考 mescroll-more 案例)
  3. */
  4. const MescrollMoreItemMixin = {
  5. props:{
  6. i: Number, // 每个tab页的专属下标
  7. index: { // 当前tab的下标
  8. type: Number,
  9. default(){
  10. return 0
  11. }
  12. }
  13. },
  14. data() {
  15. return {
  16. downOption:{
  17. auto:false // 不自动加载
  18. },
  19. upOption:{
  20. auto:false // 不自动加载
  21. },
  22. isInit: false // 当前tab是否已初始化
  23. }
  24. },
  25. watch:{
  26. // 监听下标的变化
  27. index(val){
  28. if (this.i === val && !this.isInit) {
  29. this.isInit = true; // 标记为true
  30. this.mescroll && this.mescroll.triggerDownScroll();
  31. }
  32. }
  33. },
  34. methods: {
  35. // mescroll组件初始化的回调,可获取到mescroll对象
  36. mescrollInit(mescroll) {
  37. this.mescroll = mescroll;
  38. this.mescrollInitByRef && this.mescrollInitByRef(); // 兼容字节跳动小程序 (mescroll-mixins.js)
  39. // 自动加载当前tab的数据
  40. if(this.i === this.index){
  41. this.isInit = true; // 标记为true
  42. this.mescroll.triggerDownScroll();
  43. }
  44. },
  45. }
  46. }
  47. export default MescrollMoreItemMixin;