前端学习(2715):重读vue电商网站35之在sessionStorage保存左侧菜单栏的激活状态

 

为了让我们点击二级菜单时,会有一个激活效果,而且是保持状态,我们需要将利用 element-ui 菜单栏相关 default-active 属性,来让菜单保持激活。

由于每个二级菜单都有一个路由链接,不妨将路由路径 path 存储在 sessionStorage 中,具体做法就是给二级菜单绑定一个事件:


每次触发点击事件,我们需要更新当前路由路径,才能让点击的那个按钮高亮。

然后在我们创建这个组件时,就获取当前的激活状态的路径即可。

查看 sessionStorage ,可以看到我们存储的路由路径。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/414770.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Struts2的通配符配置方式

Struts2的Action类很有意思,你可以使用3种方式来实现具体的Action类: 让你的Action类继承自ActionSupport类(项目中最常用这种方式,因为ActionSupport类中定义了很多帮助方法)让你的Action类实现Action接口使用POJO的…

spring拦截器-过滤器的区别

1. 理解 拦截器 :是在面向切面编程的时候,在你的 service 或者一个方法前调用一个方法,或者在方法后调用一个方法;比如动态代理就是拦截器的简单实现,在你调用方法前打印出字符串(或者做其它业务逻辑的操作…

前端学习(2716):重读vue电商网站36之slot插槽使用

项目需求:由于用户列表状态后台返回的是 true/false,无法进行渲染,而我们需要的是有一个Switch开关来控制我们的状态。添加一个template 模板后,此时就可以用 slot-scope 作用域插槽来获取我们数据列表中的每一行数据,…

jsp调用struts,jsp调用action,action获取表单提交的参数

自定义action类。LgqAction: Component Scope(value"prototype") public class LgqAction { private Connection conn null; private PreparedStatement pstmt null; private ResultSet rs null; public String execut…

员工信息增删改查

1 #Author guixin2 def find():3 4 查询语法如下:5 find name,age from staff_table where age > 226 find * from staff_table where dept IT7 find * from staff_table where enroll_date like 20138 9 data input("查询:&…

springmvc.xml 中 url-pattern/url-pattern节点详解

1. 先来上段常见的代码 1 <!-- MVC Servlet -->2 <servlet>3 <servlet-name>springServlet</servlet-name>4 <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>5 <…

前端学习(2717):重读vue电商网站37之通过switch开关更改用户状态

首先&#xff0c;在 switch 开关添加一个 change 事件&#xff0c;并且通过作用域插槽的形式&#xff0c;将该行数据作为参数传入&#xff0c;目的是为了后续的修改。 在函数内我们将传递过来的参数作为我们请求的参数&#xff0c;通过 put 方式修改我们的后台数据 。

边框回归(Bounding Box Regression)详解

原文地址&#xff1a;http://blog.csdn.net/zijin0802034/article/details/77685438 Bounding-Box regression 最近一直看检测有关的Paper, 从rcnn&#xff0c; fast rcnn, faster rcnn, yolo, r-fcn, ssd&#xff0c;到今年cvpr最新的yolo9000。这些paper中损失函数都包含了边…

前端学习(2718):重读vue电商网站38之通过input输入框优化

通过增加 clearable 属性&#xff0c;我们的输入框就可以多一个 x&#xff0c;然后通过绑定 clear 事件&#xff0c;当我们进行清除 &#xff08;即点击由 clearable 属性生成的清空按钮时触发)时&#xff0c;就会重新获取我们的用户列表&#xff0c;不再需要用户再次点击搜索按…

web项目Servlet配置及jsp访问Servlet

方法1&#xff1a;单一方法请求servlet 1、创建Servlet WebServlet("/HelloForm") public class HelloForm extends HttpServlet { private static final long serialVersionUID 1L; /** * see HttpServlet#HttpServlet() */ publi…

php与数据库的连接用法 (签到一)

注册页面 //插入js验证 <script type"text/javascript"> window.onload function(){ var hid document.getElementById("id"); if(hid.value !""){ //当用户名已存在数据…

Oracle不连续的值,如何实现查找上一条、下一条

1. 遇到的问题 已知一个题库&#xff0c;希望实现当前页切换上一题&#xff0c;下一题的需求。 查看得知&#xff0c;数据库中用于查询的字段(主键)是不连续的。如上图所示&#xff1a;stxh为主键number类型。 2. 实现方式lead over 2.1 实现代码 下一条 select nowId, afte…

前端学习(2719):重读vue电商网站39之正则表达式验证邮箱和手机号码

Javascript // 验证邮箱的规则var checkEmail (rule, value, cb) > {const regEmail /^([a-zA-Z]|[0-9])(\w|-)[a-zA-Z0-9]\.([a-zA-Z]{2,4})$/if (regEmail.test(value)) {// 合法的邮箱return cb()}cb(new Error(请输入合法的邮箱))}// 验证手机号码的规则var checkMobi…

支付宝提现,单笔转账到支付宝账户

很简单。只需三个参数实现 单笔转账到支付宝账户 1、获取开放平台创建的APPID&#xff0c;同时必须添加 单笔转账到支付宝账户 这个功能 开放平台&#xff1a;https://open.alipay.com/platform/home.htm 2、登录支付宝商家中心平台&#xff1a;https://b.alipay.com/index.h…

Flink系列之:Checkpoints

Flink系列之&#xff1a;Checkpoints 一、概述二、保留Checkpoint三、目录结构四、通过配置文件全局配置五、创建 state backend 对单个作业进行配置六、从保留的checkpoint 中恢复状态 一、概述 Checkpoint 使 Flink 的状态具有良好的容错性&#xff0c;通过 checkpoint 机制…

filter过滤器实现验证跳转_返回验证结果

1. 需求背景 需要对某个请求url进行拦截&#xff0c;模拟是否可以进入某一个接口&#xff0c;如果拦截需要返回数据false&#xff0c;别问我为何不用intercept拦截器。 2. web.xml <filter> <filter-name>restfulFilter</filter-name> <filter-clas…

学习基础和C语言基础调查

一.你有什么技能比大多人&#xff08;超过90%以上&#xff09;更好&#xff1f; 答&#xff1a;回答这个问题之前应该加上“我觉得”三个字&#xff1b;其实我没什么太多太实用的技能&#xff0c;无非就是一些特别的、没什么新鲜有意义的技能&#xff0c;比如说我觉得有一些不太…

前端学习(2730):重读vue电商网站40之使用vue-table-with-tree-grid

安装新的依赖 vue-tabel-with-tree-gridvue-tabel-with-tree-grid 官方文档 安装完成后&#xff0c;在 main.js 入口文件内先导入 tree-tabel 然后全局注册组件 tree-tabel 页面中&#xff0c;我们使用了如下属性&#xff1a; data 确定我们的数据源&#xff0c;columns定义我…

年终个人工作总结

这里有25篇个人年终总结&#xff0c;涵盖各行各业 http://www.duanmeiwen.com/zongjie/fanwen/46847.html https://wenku.baidu.com/view/9cddf7653069a45177232f60ddccda38376be180.html https://jz.docin.com/p-322307149.html

腾讯TBS加载网页无法自适应记录

1. 所遇到的问题 webview加载指定网页无法实现自适应&#xff0c;之前在加载重构一个网页的时候&#xff0c;其实也遇到这种问题&#xff0c;然后就有了下面的一下步骤 WebSettings webSettings view.getSettings(); webSettings.setJavaScriptEnabled(true); // settings…