当前位置: 首页 > news >正文

(vue)el-steps从别的页面跳转进来怎么实现和点击同样效果

(vue)el-steps从别的页面跳转进来怎么实现和点击同样效果


需求:

在这里插入图片描述


解决思路:监听路由,给active赋值对应下标

组件:

<el-steps:active="active"finish-status="process"class="steps custom-steps":align-center="true"
><el-stepv-for="(item, index) in StepsList.list":key="item.title":title="item.title":class="[index == active ? 'active-step' : '',index < active ? 'finish-step' : '',]"><template #icon><img:src="active == index? item.selectedIcon: active < index? item.noSelectedIcon: item.pastIcon"alt=""style="width: 60px; height: 60px"@click="selectStep(index)"></template></el-step>
</el-steps>

监听:

  watch: {'$route'(to, from) {console.log('Route change', to.path)if (to.path === '/Steps/ParameterRecommendation') {this.active = 3}}},
http://www.xdnf.cn/news/420175.html

相关文章:

  • day011-12-老男孩教育-用户管理与软件管理体系-习题
  • 18.Excel数据透视表:第1部分创建数据透视表
  • 2025java面试题整理
  • WebRTC技术EasyRTC嵌入式音视频通信SDK打造远程实时视频通话监控巡检解决方案
  • LabVIEW与PLC通讯程序S7.Net.dll
  • 国联股份卫多多与七腾机器人签署战略合作协议
  • 动态域名服务ddns怎么设置?如何使用路由器动态域名解析让外网访问内网?
  • 5.11作业
  • 5月12日作业
  • 文件同步2
  • 人事管理系统总结
  • 你对于JVM底层的理解
  • IBM BAW(原BPM升级版)使用教程第十四讲
  • 利用Backtrader实现回测策略的可视化与图表绘制
  • SpringBoot 3.X 开发自己的 Spring Boot Starter 和 SpringBoot 2.x 的区别
  • 1.6 关于static和final的修饰符
  • Spring Boot中HTTP连接池的配置与优化实践
  • Spring Spring Boot 常用注解整理
  • 服务器租用与托管注意事项有哪些
  • Shell脚本与Xshell的使用、知识点、区别及原理
  • 框架篇八股(自用)
  • Python常用函数全解析:列表、字典、集合操作指南
  • [免费]微信小程序医院预约挂号管理系统(uni-app+SpringBoot后端+Vue管理端)【论文+源码+SQL脚本】
  • 【图像处理基石】如何入门AI计算机视觉?
  • Mybatis-plus
  • 与智能体高效协作:Kimi交互逻辑探索与提示词设计实践【附kimi提示词合集下载】
  • 8天Python从入门到精通【itheima】-6~10
  • 嵌入式培训之数据结构学习(二)顺序表与单向链表
  • 2025年的电脑能装win7吗_2025年组装电脑装win7详细图文教程
  • 是 OpenCV 的 CUDA 模块中用于在 GPU 上对图像或矩阵进行转置操作函数cv::cuda::transpose