Vue-element-admin 之三级路由

2024年5月12日 158次阅读 来源: 灼灼桃花夭

参考官网，添加跳转页面之后，子页面中，操作栏不能固定在右侧，

<el-table
  :data="list"
  style="height: 100%;"
  class="handright"
  @sort-change="sortChange"
  @selection-change="handleSelectionChange"
>

添加样式 handright 之后，操作栏可以固定右侧，但是分页样式错位

.handright {
  position: fixed; 
  /* z-index: 1; */
  /* z-index: 0; */
}

报错的跳转页面

<template>
 <div style="padding:10px;">
    <el-alert :closable="false" title="">  // 去掉这个标签，就可以了
      <router-view />
    </el-alert>
  </div>
</template>

<style>
.el-alert--info.is-light {
    background-color: white;
    color: white;
}
.el-alert {
  overflow: auto !important;
}
</style>

参考 https://blog.csdn.net/qq_14926871/article/details/80859144

正确的中间跳转页面 publish-center.vue

<template>
  <router-view />
</template>
<script>
export default {

}
</script>

路由中

{
    path:'/recordQuery',
    component:Home,
    name:'菜单1',
    iconCls:'el-icon-search',
    children:
     [
        { 
         	path: 'carRecord', 
         	z:'1',
            component: () => import('@/page/publish-center.vue'),   // 重要，中间跳转页面，必要
            name: '菜单2' , 
            children:[
            			{ path: '/carRecord/passRecord', component: passRecord, name: '菜单' },

                     ]
             },
         ]
},
    原文作者：灼灼桃花夭
    原文地址: https://blog.csdn.net/qq_39835505/article/details/123182941
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞