Element--el-tabs固定在顶部问题
作者：迷阵
这篇文章主要介绍了Element--el-tabs固定在顶部问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
Element--el-tabs固定在顶部
解决方案
.el-tabs--card {
height: calc(100vh - 110px);
/* overflow-y: auto; */
}
.el-tab-pane {
height: calc(100vh - 110px);
overflow-y: auto;
}ElementUI使用el-table标签操作固定位置
示例代码：
<el-table-column label="操作"> <template slot-scope="scope"> <el-row :gutter="12" class="nav"> <el-col :span="8"> <el-button size="medium" type="text" @click="edit(scope.$index, scope.row)">查看</el-button> </el-col> <el-col :span="6"> <el-button size="medium" type="text" @click="Delete(scope.$index, scope.row)">删除</el-button> </el-col> </el-row> </template> </el-table-column>
增加<el-row>标签固定gutter值，这样可以防止页面变形！
el-tabs跳转页面到指定的tab上
功能：实现点击页面A的“更多”，跳转到页面B的“重大消息”
先看一下el-tabs的代码
<div class="tabs">
<el-tabs v-model="activeName" @tab-click="changeTab">
<el-tab-pane label="系统推送" name="receivedAutoNotice"></el-tab-pane>
<el-tab-pane label="管理员通知" name="receivedNotice"></el-tab-pane>
<el-tab-pane label="重大通知" name="receivedAnnounce"></el-tab-pane>
</el-tabs>
</div>data(){
return{
currentTab:'receivedAutoNotice',//默认选择系统推送
activeName:'receivedAutoNotice',
}
}首先，在页面A跳转路由时将activeName和currentTab带上。
this.$router.push({path:'/notify?activeName=receivedAnnounce¤tTab=receivedAnnounce'});然后注意在页面B接收：
mounted(){
this.showface();
},
method:{
showface(){
if(this.$route.query.activeName!=null){
this.activeName = this.$route.query.activeName;
this.currentTab = this.$route.query.currentTab;
var current1 = this.currentTab;
this.loading = true;
if(current1=='receivedAnnounce'){
this.gerAnnounceList() //这里写一些跳转后必须要执行的函数
}
}
},
}总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。