el-tabs点击刷新

最新推荐文章于 2025-04-27 18:04:10 发布

远水去见远山

最新推荐文章于 2025-04-27 18:04:10 发布

阅读量776

点赞数

文章标签： vue

本文链接：https://blog.youkuaiyun.com/weixin_48621384/article/details/118324769

版权

本文介绍如何在Vue项目中使用el-tabs组件，通过维护数据对象实现切换状态保持，并利用函数处理切换时的刷新操作。主要内容包括el-tabs模板代码、data对象的设置以及切换时触发的函数和辅助函数的实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一，el-tabls的template代码(红色切为切换的状态保持js对象)

  <el-tabs type="card" v-model="activeName" @tab-click="handleTabClick">
      <el-tab-pane label="发布单管理" name="deploy" value="">
          <deploy-list v-if="tabRefresh.deploy"/>
      </el-tab-pane>
      <el-tab-pane label="构建参数" name="build">
          <build-list v-if="tabRefresh.build"/>
      </el-tab-pane>
      <el-tab-pane label="K8s集群" name="k8s">
          <k8s-list v-if="tabRefresh.k8s"/>
      </el-tab-pane>
      <el-tab-pane label="Yaml模板" name="yaml">
          <yaml-list v-if="tabRefresh.yaml"/>
      </el-tab-pane>
      <el-tab-pane label="历史部署" name="history">
          <deploy-list v-if="tab