1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- <template>
- <div>
- <TopSwiper :tops='tops'></TopSwiper>
- <!-- <p>图书列表</p> -->
- <Card v-for="book in books" :key="book.openid" :book='book'></Card>
- <p class="text-footer" v-if="!more">
- 没有更多数据
- </p>
- </div>
- </template>
- <script>
- // 35条数据
- // 每次加载10条
- // 0页 0-10
- // 1 10-20
- // 2 20-30(5)
- // page 当前第几页
- // 没有更多数据
- // 1. page=0 不能显示这条提醒
- // 2. page>0 数据长度<10 停止触底加载
- import {get} from '@/util'
- import Card from '@/components/Card'
- import TopSwiper from '@/components/TopSwiper'
- export default {
- components: {
- Card,
- TopSwiper
- },
- data () {
- return {
- books: [],
- page: 0,
- more: true,
- tops: []
- }
- },
- methods: {
- async getList (init) {
- if (init) {
- this.page = 0
- this.more = true
- }
- wx.showNavigationBarLoading()
- const books = await get('/weapp/booklist', {page: this.page})
- if (books.list.length < 10 && this.page > 0) {
- this.more = false // 这种情况下 没有更多数据了
- // console.log(this.more);
- }
- if (init) {
- this.books = books.list
- wx.stopPullDownRefresh() // 手动停止下拉刷新
- } else {
- // 下拉刷新,不能直接覆盖books 而是累加
- this.books = this.books.concat(books.list)
- }
- wx.hideNavigationBarLoading() // 关闭下拉刷新加载
- },
- async getTop () {
- const tops = await get('/weapp/top')
- this.tops = tops.list
- }
- },
- onPullDownRefresh () {
- this.getList(true)
- // console.log('下拉');
- this.getTop()
- },
- onReachBottom () {
- // console.log('没有更多了')
- if (!this.more) {
- // 没有更多了
- return false
- }
- this.page++
- // console.log('上啦加载', this.page)
- this.getList()
- },
- mounted () {
- this.getList(true)
- this.getTop()
- }
- }
- </script>
- <style lang='scss'>
- </style>
|