caimei-applets-mcare/pages/goods/active-product.vue

<template>
    <view class="">
        <tui-skeleton
        	v-if="skeletonShow"
        	backgroundColor="#fafafa"
        	borderRadius="10rpx"
        	:isLoading="true"
        	:loadingType="5"
        ></tui-skeleton>
        <view class="active-product" v-else>
            <ProGood v-for="item in activeProductList" :key="item" :storeInfo="item" />
        </view>
    </view>
</template>

<script>
    import ProGood from './components/procurement_good.vue'
    export default {
        components: {
            ProGood,
        },
        data() {
            return {
                skeletonShow: true,
                activeProductList: [], // 活动商品列表
                refleshdata: {} // 刷新数据
            }
        },
        onLoad(options) {
            this.refleshdata = options
            this.activeProduct(options)
        },
        onPullDownRefresh() {
            this.skeletonShow = true
            this.activeProduct(this.refleshdata)
            uni.stopPullDownRefresh()
        },
        methods: {
            // 楼层商品数据
            async activeProduct(options) {
                try{
                    const {data} = await this.SpecialService.activeProduct({imageId: options.activeImageId})
                    this.activeProductList = data
                    uni.setNavigationBarTitle({
                        title: data[0].topic
                    })
                    this.skeletonShow = false
                }catch(error){
                    console.log(error)
                }
            }
        }
    }
</script>

<style lang="scss">
    page {
    	background-color: #f7f7f7;
    }
    .active-product {
        background: #f7f7f7;
        display: flex;
        flex-wrap: wrap;
        padding: 24rpx;
        justify-content: space-between;
    }
</style>