swiper-list.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. export default {
  2. data() {
  3. return {
  4. MIXIN_NowIndex: 0,
  5. MIXIN_ActiveIndex: 0,
  6. MIXIN_MoveBarLeft: 0,
  7. MIXIN_FinishedIndex: 0,
  8. MIXIN_ScrollViewHeight: 0, // scroll view 高
  9. MIXIN_ScreenWidth: this.$store.state.device.screenWidth, // 屏幕宽,
  10. MIXIN_api_all: false
  11. }
  12. },
  13. mounted() {
  14. this.$offset('.swiper').then(res => {
  15. this.MIXIN_ScrollViewHeight = res.height
  16. }) // 设置scrollview 高
  17. },
  18. methods: {
  19. MIXIN_transition({
  20. detail: {
  21. dx
  22. }
  23. }) { // swiper 切换时 ///////////////////////////////////////////////////////////////////<固定写法>
  24. // this.MIXIN_MoveBarLeft = this.MIXIN_FinishedIndex * (this.MIXIN_ScreenWidth / this.typeList.length) + dx / this.typeList.length
  25. },
  26. MIXIN_change({
  27. detail: {
  28. current
  29. }
  30. }) {
  31. this.MIXIN_ActiveIndex = current
  32. this.MIXIN_MoveBarLeft = this.MIXIN_ActiveIndex * (this.MIXIN_ScreenWidth / this.typeList.length)
  33. },
  34. MIXIN_animationfinish({
  35. detail: {
  36. current
  37. }
  38. }) { // swiper 停止切换
  39. this.MIXIN_FinishedIndex = this.MIXIN_NowIndex = current
  40. if (!this.lists[this.MIXIN_NowIndex].length && this.page[this.MIXIN_NowIndex] !==
  41. 0) { // 当当前类型数量为 0 且有不是 没有更多时请求列表
  42. this.MIXIN_request()
  43. }
  44. },
  45. switchSwiper(index) { // 点击导航栏切换
  46. this.MIXIN_NowIndex = this.MIXIN_ActiveIndex = index
  47. this.MIXIN_MoveBarLeft = (this.MIXIN_NowIndex + 1) * (this.MIXIN_ScreenWidth / this.typeList.length)
  48. }, /////////////////////////////////////////////////////////////////////////////////////////////////////////////////<固定写法>
  49. MIXIN_pulldownrefresh() { // 下拉刷新
  50. this.page[this.MIXIN_NowIndex] = 1
  51. this.MIXIN_request().then(() => {
  52. this.$refs.pulldownRefresher.pullup()
  53. })
  54. },
  55. MIXIN_scrolltolower() { // 上拉加载
  56. this._requesting ? '' : this.MIXIN_request('loadmore')
  57. },
  58. MIXIN_request(action) { // 请求数据
  59. if (this.MIXIN_api_all) {
  60. let a = []
  61. this.apis.forEach(api => {
  62. a.push(api({
  63. page: 1
  64. }))
  65. })
  66. return Promise.all(a).then(res => {
  67. this.MIXIN_api_all = false
  68. res.forEach(({
  69. data
  70. }, i) => {
  71. this.totalList[i] = data.total
  72. this.lists[i] = data.list
  73. if (data.list && data.list.length < data.size) {
  74. this.page[i] = 0
  75. } else {
  76. this.page = [2, 2]
  77. }
  78. })
  79. this.MIXIN_requestHandle ? this.MIXIN_requestHandle(res[0]) : '' // 执行请求结束处理函数
  80. })
  81. } else {
  82. return new Promise(resolve => { // 只有在 首次加载列表或者下拉刷新时才显示 liaoding
  83. if (this.page[this.MIXIN_NowIndex]) { // 当上一批数量不小于 size 时执行
  84. !action && uni.showLoading({
  85. mask: true
  86. }) // 开始 loading, 只有在 首次加载列表或者下拉刷新时才显示 liaoding
  87. this._requesting = true // 请求加锁防抖
  88. let params = {
  89. page: this.page[this.MIXIN_NowIndex]
  90. }
  91. this.queryParams ? Object.assign(params, this.queryParams) : params
  92. this.apis[this.MIXIN_NowIndex](params).then(res => {
  93. this.MIXIN_requestHandle ? this.MIXIN_requestHandle(res) : '' // 执行请求结束处理函数
  94. !action ? this.lists[this.MIXIN_NowIndex] = [] : '', // 如果是下拉刷新,清空列表
  95. this.lists[this.MIXIN_NowIndex] = [...this.lists[this.MIXIN_NowIndex],
  96. ...res.data.list
  97. ]
  98. res.data.list.length < +res.data.size ? this.page[this.MIXIN_NowIndex] = 0 :
  99. this.page[this.MIXIN_NowIndex] += 1 // 如果返回列表数量小于 10 表示没有更多了
  100. }).catch(() => { // 网络请求失败 进入失败状态
  101. this.page[this.MIXIN_NowIndex] = -1
  102. this.lists[this.MIXIN_NowIndex] = []
  103. }).finally(() => { // promise 结束
  104. this._requesting = false // 取消请求加锁防抖
  105. resolve() // 通知下拉刷新收起并把数据传出去
  106. })
  107. }
  108. })
  109. }
  110. } ///////////////////////////////////////////////////////////////////////////////////////<固定写法>
  111. }
  112. }