Vue切换Tab动态渲染组件的操作

使用

结合Element-UI的导航菜单 :

UI组件

el-menu-item里的index写对应的组件名

点击事件@select="handleSelect"

  首页
  关于我们

在点击事件里动态设置组件名

handleSelect(index) {
  this.activeIndex = index
}

完整代码

补充知识：vue 动态组件（tabs切换）keep-alive：主要用于保留组件状态或避免重新渲染

通过keep-alive 保留数据值 填写数据时切换到其他页面，后返回当前页数据保留 ，主要用于保留组件状态或避免重新渲染

 
 
 
 

  
首页
  
关于我们
 
 
 
  
 
 

以上这篇Vue切换Tab动态渲染组件的操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持考高分网。