crm-mobile/pages_message/index.vue

<template>
  <view v-if="!refreshPage" class="uni-app">
    <view class="status-bar" />
    <view class="main-container">
      <list-tab-header
        v-model="navIndex"
        :nav-list="navList"
        :show-search="false" />
			
      <view class="list-view">
        <wk-keep-alive v-model="navIndex">
          <wk-keep-alive-item>
            <message-list />
          </wk-keep-alive-item>
          <wk-keep-alive-item>
            <backlog-list />
          </wk-keep-alive-item>
        </wk-keep-alive>
      </view>
    </view>

    <wk-tabbar v-model="footerIndex" :list="mixinFooterNav" />
  </view>
</template>

<script>
  import ListTabHeader from '@/components/base/list-tab-header.vue'
  import tabbar from '@/mixins/tabbar.js'
  import MessageList from './messageList.vue'
  import BacklogList from './backlogList.vue'
	
  export default {
    name: 'MessageIndex',
    components: {
      ListTabHeader,
      MessageList,
      BacklogList
    },
    mixins: [tabbar],
    data() {
      return {
        navIndex: 0,
        navList: [
          { label: '消息', com: 'message', action: ''},
          { label: '待办', com: 'backlog', action: '' }
        ],
				
        refreshPage: false	// 刷新页面标志
      }
    },
    onShow() {
      const i = this.navIndex
      this.navIndex = -1
      this.$nextTick(() => {
        this.navIndex = i
      })
			
      // if (this.refreshPage) {
      // 	this.$nextTick(function(){
      // 		this.refreshPage = false
      // 	})
      // }
    },
    methods: {}
  }
</script>

<style scoped lang="scss">
	.main-container {		
		
		.list-view {
			flex: 1;
			overflow-y: hidden;
			
			.wk-keep-alive {
				width: 100%;
				height: 100%;
				overflow: hidden;
				.wk-keep-alive-item {
					width: 100%;
					height: 100%;
					overflow: hidden;
				}
			}
		}
	}
</style>