实现要求:
  • 打开当前界面时,只加载当前标签页数据组件内容,而不是默认的将所有标签页都加载完毕,而是在切换标签页时候,加载数据。
方法:添加v-if判断,在当前标签页时,就将其对应的isShow设为true
<el-tabs v-model="activeName" @tab-click="handleClick">
   <el-tab-pane v-if="isShow" name="queryFeature">xxx</el-tab-pane>
   <el-tab-pane v-if="isShow2" name="dataFeature">xxx</el-tab-pane>
</el-tabs>
具体操作如下:
  • 定义所需的数据
data(){
	return{
		isShow:true,//默认值,默认显示第一个tab
		isShow2:false,//默认值
	}
}
  • 实现具体的方法
function handleClick(tab){
	if(tab.name === queryFeature){
		this.isShow = true;
		this.isShow2 = false;
	}else{
		this.isShow = false;
		this.isShow2 = true;
	}
}
Logo

前往低代码交流专区

更多推荐