记录一次移动端底部导航有的页面需要固定有的不需要展示的解决方法

1方法， 写2个layout 里面引入不同的layout

import Layout from '@/views/Layout/index.vue'
import twoLayout from '@/views/Layout/twoIndex.vue'

 {
    path: '/orderForm',
    name: 'orderForm',
    component: Layout,
    children: [
      {
        path: 'index',
        name: 'orderFormAll',
        component: () => import('@/views/orderForm/page/orderFormAll.vue')
      },
      {
        path: 'orderFormSearch',
        name: 'orderFormSearch',
        component: () => import('@/views/orderForm/page/orderFormSearch.vue')
      }
    ]
  },
  {
    path: '/orderForm',
    name: 'twoOrderForm',
    component: twoLayout,
    children: [
      {
        path: 'addOrder',
        name: 'addOrder',
        component: () => import('@/views/orderForm/page/addOrder.vue')
      }
    ]
  },

2方法

• layout 中添加 覆盖

<template>
  <div class="container">
    <router-view class="main"></router-view>
    <router-view name="other" class="other"></router-view>
    <my-footer></my-footer>
  </div>
</template>
<script>
import myFooter from './footer'
export default {
  components: {
    myFooter
  },
  data () {
    return {
    }
  },
  mounted () {
  },
  computed: {
  },
  methods: {
  }
}
</script>
<style lang="scss" scoped>
.container{
  height: 100vh;
  background-color: #F4F4F4;
  position: relative;
  .main{
    height: calc(100% - 1.48rem);
    overflow: auto;
  }
  .other {
    z-index: 20210225; // 添加承继覆盖
  }
}
</style>

• 引入
• components: { other: () => import(’@/views/customer/page/index.vue’) }
  },

{
    path: '/customer',
    name: 'customer',
    component: Layout,
    children: [
      {
        path: 'index',
        name: 'customerIndex',
        components: { other: () => import('@/views/customer/page/index.vue') },
        meta: { title: '客户' }
      },
      {
        path: 'cusdetail',
        name: 'customerDetail',
        components: { other: () => import('@/views/customer/page/cusDetail.vue') },
        meta: { title: '客户详情' }
      }
    ]
  }