index.vue 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <view class="list-page">
  3. <up-list @scrolltolower="scrolltolower" style="height: 100%;">
  4. <up-list-item v-for="(item, index) in data" :key="index" >
  5. <ListItem :data="item"/>
  6. </up-list-item>
  7. <up-loadmore
  8. :line="true"
  9. status="nomore"
  10. ></up-loadmore>
  11. </up-list>
  12. </view>
  13. </template>
  14. <script setup>
  15. import { ref, reactive } from 'vue';
  16. import { onLoad, onShow } from '@dcloudio/uni-app';
  17. import ListItem from './listItem.vue';
  18. const props = defineProps({
  19. data: {
  20. type: Array,
  21. default: [],
  22. },
  23. });
  24. const emit = defineEmits(['refresh']);
  25. const scrolltolower = () => {
  26. console.log('底部');
  27. // emit('refresh');
  28. };
  29. </script>
  30. <style lang="scss" scoped>
  31. .list-page {
  32. background: rgba(245, 245, 245, 1);
  33. padding: 12px;
  34. height: 100%;
  35. overflow-y: auto;
  36. .item {
  37. height: 120px;
  38. border-radius: 10px;
  39. background: rgba(255, 255, 255, 1);
  40. padding: 12px;
  41. }
  42. }
  43. </style>