<template>
    <view>
        <view v-for="(item,index) in list" :key="index" class="container">
            <view class="container-wrap">
                <image :src="item.image" mode="scaleToFill"></image>
                <view class="title">{{item.title}}</view>
            </view>
        </view>
        <div v-if="flag">-------我是有底线的------</div>
        </view>
</template>
<script>
    import api from '@/utils/api.js'
    export default {
        data() {
            return {
                list: [],
                page: 1,
                flag: false,

            }
        },
        onLoad(opt) {
            this.getList();
        },
        methods: {
            getList(callback) {
                const params = {
                    uid: '696443691',
                    page: this.page
                };
                api.menu.fav(params).then(res => {
                    console.log('res22', res)
                    if (res.code == 200) {
                        res.data.forEach(item => {
                            item.image = 'http:' + item.image;
                        })
                        this.list = [...this.list, ...res.data];
                        callback && callback()
                    }
                }).catch(err => {
                    console.log(err)
                })
            }

        },
        onReachBottom() { //触底触发
            if (this.list.length < this.page * 6) {
                this.flag = true;
                return false;
            }
            this.page++;
            this.getList();
        },
        onPullDownRefresh() { //下拉刷新
            this.page = 1;
            this.list = [];
            this.flag = false;
            this.getList(() => {
                uni.stopPullDownRefresh()
            })
        }
    }
</script>