jje_uniapp/myPages/rechargeRecord/index.vue

 <template>
    <view class="page">
        <u-sticky>
            <View class=" tabs">
                <u-tabs :list="tabList" :scrollable="false"
                        lineWidth="30"
                        lineColor="#FFE05C"
                        :activeStyle="{
            					color: '#333333',
            					fontWeight: 'bold',
            					transform: 'scale(1.05)'
       							 }"
                        :current="tabIndex" @click="clickTab"></u-tabs>
            </View>
        </u-sticky>

        <!-- 订单列表 -->
        <view :style="{'height':windowHeight}" >
            <swiper :style="{'height':windowHeight}" :current="tabIndex" @change="swiperChange">
                <swiper-item class="swiperItem" v-for="(item,index) in tabList" :key="index" >
                    <view>
                        <mescroll-item ref="MescrollItem" :i="index"  :index="tabIndex" :tabs="tabList" :height="windowHeight">
                        </mescroll-item>
                    </view>
                </swiper-item>
            </swiper>
        </view>

    </view>
</template>
<script>
    import MescrollItem from "./module/mescrollUni-item.vue";

    export default {
        components: {
            MescrollItem
        },
        data() {
            return {
                windowHeight:'',
                tabIndex:0,

                tabList: [{
                    name: '全部',
                }, {
                    name: '可退款'
                }, {
                    name: '不可退款',
                }],


            };
        },
        onLoad(e) {

            let sysInfo = uni.getSystemInfoSync()
            this.windowHeight =sysInfo.windowHeight-44+'px'//除标题栏栏外的屏幕可用高度

        },
        onShow(){
            //退款成功后，刷新列表监听事件
            uni.$off('rechargeRecordDownCallback')
            uni.$on('rechargeRecordDownCallback',this.downCallback)
        },
        methods: {

            downCallback(){
                this.$refs.MescrollItem[this.tabIndex].downCallback()
            },

            clickTab(e){
                this.tabIndex = e.index
            },
            swiperChange(e){

                this.tabIndex = e.detail.current
                // if (this.$refs.MescrollItem[e.detail.current].list.length>0){
                // 	this.$refs.MescrollItem[e.detail.current].downCallback()
                // }
            },


        },
    };
</script>
<style lang="scss" scoped>
    @import '../../common/css/common.css';
    @import './index.rpx.css';
</style>