PullUp.vue 980 B

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <template>
  2. <!-- 移动端上拉加载更多 -->
  3. </template>
  4. <script>
  5. export default {
  6. props: ['searchMore', 'allPage', 'page'],
  7. mounted () {
  8. let _this = this
  9. _this.$nextTick(function () {
  10. window.addEventListener('scroll', function () {
  11. _this.scroll()
  12. }, false)
  13. })
  14. },
  15. methods: {
  16. scroll: function () {
  17. let scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
  18. if (Math.ceil(scrolled + window.screen.availHeight) >= document.body.scrollHeight && !this.searchMore && this.page < this.allPage) {
  19. this.getMore()
  20. }
  21. },
  22. getMore: function () {
  23. if (!this.searchMore) {
  24. this.$emit('pullUpAction')
  25. }
  26. }
  27. }
  28. }
  29. </script>
  30. <style lang="scss" scoped>
  31. .loading {
  32. text-align: center;
  33. background: #fff;
  34. >img {
  35. width: .64rem;
  36. height: .64rem;
  37. margin: .2rem 0;
  38. }
  39. }
  40. </style>