com-tabs-wxs-list-refresh

#com-tabs-wxs-list-refresh

<template>
  <com-tabs-wxs-list-refresh
      ref="COMTabsWxs"
      :height="(windowHeight)"
      class="page"
      hasRefreshContainerBackgroundColor="#000"
      minWidth="125rpx"
      v-slot:defList="{props}"
      tabsSticky>
    <defList   v-slot:row="{item, index}" :tab="props.tab" :index="props.index" :show="props.show" :current="props.current" :custom-data="props.customData">
      <com-tabs-wxs-list-cell :key="index">
       {{item}}
      </com-tabs-wxs-list-cell>
    </defList>
    <!--    <view slot="pos">1</view>-->
    <!--    <view slot="pre">2</view>-->
  </com-tabs-wxs-list-refresh>
</template>

<script>

import ComTabsWxsListCell from "components/com-tabs-wxs-list/components/com-paging-cell/com-tabs-wxs-list-cell";
const app = getApp();

let {windowHeight} = uni.getSystemInfoSync();

console.log( uni.getSystemInfoSync() )

import comTabsWxsListRefresh from "components/com-tabs-wxs-list/com-tabs-wxs-list-refresh";
import defList from './defList'

export default {
  options: {styleIsolation: 'shared'},

  components: {
    ComTabsWxsListCell,
    comTabsWxsListRefresh,
    defList,
  },

  onReady() {
    // this.getTopViewHeight();
    let colors = [
      {
        name: 'tab_1', //名称 必选
        id: 'tab_1',// 唯一字段 必选
        hasRefreshContainerBackgroundColor: '#429950',
        swiperItemBackgroundColor: '#5f3bb0',
        swiperBackgroundColor: 'pink',
        tabsBackgroundColor: '#124881',
        activeFontColor: '#bec3cb',
        lineColor: '#ffbc36',
        badge: 0, //占未开放
      },
      {
        name: 'tab_2',
        id: 'tab_2',
        hasRefreshContainerBackgroundColor: '#429950',
        swiperItemBackgroundColor: '#79b03b',
        swiperBackgroundColor: '#444',
        tabsBackgroundColor: '#a0481c',
        activeFontColor: '#053891',
        lineColor: '#ddd4d7',
        badge: 0, //占未开放
      },
    ]


    this.$refs.COMTabsWxs.setTabs(new Array(6).fill({},).map((ov, index) => (Object.assign({}, colors[index % 2], {
      name: `tab_${index}`,
      id: `tab_${index}`
    }))));


  },

  data() {
    // #ifdef H5
    windowHeight = windowHeight - (44 + 50); // header + tabber
    // #endif
    return {
      topBottomViewHeight: 0,
      windowHeight,
      sendData: {},

    };
  },
  onLoad: function (options) {

  },


  methods: {
    getTopViewHeight() {
      let view = uni.createSelectorQuery().in(this);
      view.select('.topView').boundingClientRect();
      view.exec(res => {
        // console.log('总高度:' + JSON.stringify(res));
        this.topBottomViewHeight = res[0].height
      })
    },

  }
};
</script>
<style lang="scss">


</style>
<style lang="scss">
.page {
  position: fixed;
  height: 100vh;
  width: 100%;
}
</style>