mobile/src/pages/index/index.vue

<template>
  <view class="work">
    <view class="status-bar">
      <!-- 这里是状态栏 -->
    </view>
    <div class="custom-navigation">
      <UserSpace></UserSpace>
    </div>
    <u-tabs :list="tabList" :is-scroll="false" :current="current" @change="tabChange"></u-tabs>
    <view style="height: calc(100% - 25px - 180rpx)">
      <Tab1 v-if="current == 0"></Tab1>
      <Tab2 v-else-if="current == 1"></Tab2>
      <Tab3 v-else-if="current == 2"></Tab3>
    </view>
    <Auth></Auth>
  </view>
</template>

<script>
  import Tab1 from './tab1-content.vue'
  import Tab2 from './tab2-content.vue'
  import Tab3 from './tab3-content.vue'
  import Auth from '@/components/auth.vue'
  import UserSpace from '@/components/user-space.vue'
  export default {
    name: 'IndexPage',
    components: { Tab1, Tab2, Tab3, Auth, UserSpace },
    data() {
      return {
        tabList: [{ name: '消息提醒' }, { name: 'SOP待办' }, { name: '通知公告' }],
        current: 0
      }
    },
    created() {},
    methods: {
      upper() {},
      lower() {},
      scroll() {},
      tabChange(index) {
        this.current = index
      }
      // doRouter(url) {
      //   // 路由跳转
      //   this.$Router.push({ path: url, query: { name: 'sop' } })
      //   // 在onLoad中使用this.$Route.query获取参数
      // },
      // jumpToSwitchTab(url) {
      //   this.$Router.pushTab({ path: url, query: { name: 'sop' } })
      // }
    }
  }
</script>

<style lang="scss" scoped>
  .work {
    height: 100vh;
  }
</style>