testingRoomList.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <template>
  2. <view class="container">
  3. <uni-card :title="istitle" class="cardBox">
  4. <uni-list border class="list">
  5. <uni-list-item v-for="(item, index) in dataList" :key="index" :note="item.note" :ellipsis="1" :title="item.title" link clickable @click="listItemBtn(item)" ></uni-list-item>
  6. </uni-list>
  7. <uni-load-more :status="more" />
  8. </uni-card>
  9. </view>
  10. </template>
  11. <script>
  12. import request from '../../api/cms.js';
  13. export default {
  14. onLoad: function (option) {
  15. this.alias = option.alias;
  16. },
  17. data() {
  18. return {
  19. dataList: [],
  20. more: 'more',
  21. page: 0,
  22. size: 20,
  23. alias: ''
  24. }
  25. },
  26. async mounted() {
  27. await this.getList();
  28. },
  29. methods: {
  30. listItemBtn(e) {
  31. uni.navigateTo({ url: `/pages/details/cmsinfo?id=${e.id}` });
  32. },
  33. // 查询列表函数
  34. async getList() {
  35. this.page += 1;
  36. this.more = 'loading';
  37. const res = await request.getArticleList({ pageNum: this.page, pageSize: this.size, typeName: this.alias });
  38. this.dataList.push(...res.rows)
  39. // 根据总数 算页数 如果当前页 = 总页数就是没有数据 否则就是上拉加载
  40. this.more = this.page >= Math.ceil(res.total / this.size) ? 'noMore' : 'more';
  41. },
  42. },
  43. // 页面生命周期中onReachBottom(页面滚动到底部的事件)
  44. onReachBottom() {
  45. if(this.more != 'noMore') {
  46. this.more = 'more';
  47. this.getList();
  48. }
  49. }
  50. }
  51. </script>
  52. <style>
  53. </style>