热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

点击Tab标签切换不同查询数据,并选择数据存入缓存实现两个界面带参数跳转

项目场景:在不同的tab标签页中点击不同的标签页查找不同的内容,然后选中其中一个页面中的一条数据将此数据某个信息选中然后存入session缓存当中然后另一个界面从s

项目场景:

在不同的tab标签页中点击不同的标签页查找不同的内容,然后选中其中一个页面中的一条数据将此数据某个信息选中然后存入session缓存当中然后另一个界面从session中取出,从而达到带参数跳转界面的需求




问题描述

可以做到跳转界面但是数据会显示到地址栏当中,隐秘性差




解决方案:


提示:这里填写该问题的具体解决方案:


一.先是切换标签页的功能

就是在tab标签页设置一个name属性然后赋值,使用点击事件获取这个name属性的值再根据取到的值做判断即可,代码如下:


    //在科患者点击tab导航页查询
            const handleClick = function(tab, event) {
                let date = tab.props.name
                if (date === 'KS') {
                    _this.getZKpatient()
                } else if (date === 'GR') {
                    getZKGRGRpatient()
                }
            }
            //出院患者点击tab导航页查询
            const handleClicks = function(tab, event) {
                let date = tab.props.name
                if (date === 'KSS') {
                    _this.getDispatients()
                } else if (date === 'GRS') {
                    getGRDispatients()
                }

            }


二:将参数写入缓存跳转界面


1.import generateRoute from "@/router/generate.ts";
    import { useRouter } from 'vue-router'

先引入组件


 


2.    //双击跳转界面
            const handleClicker = function(row, event, column) {
                _this.currentRowInedx = row.row_index
                sessionStorage.setItem('ordersPatientId', row.PATIENT_ID)
                sessionStorage.setItem("ordersVisitId", row.VISIT_ID)
                generateRoute(router,"InpDoctor")
                context.emit('eventIsObject', { keyName: '' })

            }


前两步就是写入缓存和跳转界面下面就是另外的界面取出参数


3.import doctorworkbench from "xxxxxxxx.vue"

先将自己的界面引入到另外的界面



4.然后是这样写就可以取出来并赋值了

patientId:sessionStorage.getItem("ordersPatientId"),visitId:sessionStorage.getItem("ordersVisitId")



推荐阅读
  • 本文详细介绍了Java中org.neo4j.helpers.collection.Iterators.single()方法的功能、使用场景及代码示例,帮助开发者更好地理解和应用该方法。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 本文介绍如何使用Objective-C结合dispatch库进行并发编程,以提高素数计数任务的效率。通过对比纯C代码与引入并发机制后的代码,展示dispatch库的强大功能。 ... [详细]
  • 技术分享:从动态网站提取站点密钥的解决方案
    本文探讨了如何从动态网站中提取站点密钥,特别是针对验证码(reCAPTCHA)的处理方法。通过结合Selenium和requests库,提供了详细的代码示例和优化建议。 ... [详细]
  • 1.如何在运行状态查看源代码?查看函数的源代码,我们通常会使用IDE来完成。比如在PyCharm中,你可以Ctrl+鼠标点击进入函数的源代码。那如果没有IDE呢?当我们想使用一个函 ... [详细]
  • 本文详细介绍了如何使用 Yii2 的 GridView 组件在列表页面实现数据的直接编辑功能。通过具体的代码示例和步骤,帮助开发者快速掌握这一实用技巧。 ... [详细]
  • 本文详细介绍了Akka中的BackoffSupervisor机制,探讨其在处理持久化失败和Actor重启时的应用。通过具体示例,展示了如何配置和使用BackoffSupervisor以实现更细粒度的异常处理。 ... [详细]
  • 本文详细解析了Python中的os和sys模块,介绍了它们的功能、常用方法及其在实际编程中的应用。 ... [详细]
  • 本文探讨了 Objective-C 中的一些重要语法特性,包括 goto 语句、块(block)的使用、访问修饰符以及属性管理等。通过实例代码和详细解释,帮助开发者更好地理解和应用这些特性。 ... [详细]
  • 主要用了2个类来实现的,话不多说,直接看运行结果,然后在奉上源代码1.Index.javaimportjava.awt.Color;im ... [详细]
  • 深入解析Spring Cloud Ribbon负载均衡机制
    本文详细介绍了Spring Cloud中的Ribbon组件如何实现服务调用的负载均衡。通过分析其工作原理、源码结构及配置方式,帮助读者理解Ribbon在分布式系统中的重要作用。 ... [详细]
  • 本文介绍了如何在C#中启动一个应用程序,并通过枚举窗口来获取其主窗口句柄。当使用Process类启动程序时,我们通常只能获得进程的句柄,而主窗口句柄可能为0。因此,我们需要使用API函数和回调机制来准确获取主窗口句柄。 ... [详细]
  • 掌握远程执行Linux脚本和命令的技巧
    本文将详细介绍如何利用Python的Paramiko库实现远程执行Linux脚本和命令,帮助读者快速掌握这一实用技能。通过具体的示例和详尽的解释,让初学者也能轻松上手。 ... [详细]
  • 本文探讨了如何在给定整数N的情况下,找到两个不同的整数a和b,使得它们的和最大,并且满足特定的数学条件。 ... [详细]
  • 在 Swift 编程中,遇到错误提示“一元运算符 '!' 不能应用于 '()' 类型的操作数”,通常是因为尝试对没有返回值的方法或函数应用逻辑非运算符。本文将详细解释该错误的原因,并提供解决方案。 ... [详细]
author-avatar
知知亦不知_710
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有