VUE 项目中退出登入后禁止返回键操作

深碍√TFBOYSˉ_ 2023-06-20 10:45 28阅读 0赞

HTML代码： （**点击 退出登录时 触发 loginout命令,它在js中进行了监听**）

<el-dropdown class="user-name" trigger="click" @command="handleCommand">
                        <span class="el-dropdown-link">
                            {
       {username}} <i class="el-icon-caret-bottom"></i>
                        </span>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item><p @click="changePassword">密码修改</p> </el-dropdown-item>
                            <el-dropdown-item divided  command="loginout">退出登录</el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>

JS代码：

// 用户名下拉菜单选择事件
            handleCommand(command) {
                if(command == 'loginout'){
                    sessionStorage.clear();
                    this.$router.push("/login");
                    history.pushState(null, null, document.URL);
                    window.addEventListener("popstate",function(e) {  
                        history.pushState(null, null, document.URL);
                    }, false);
                }
            },

备注：

> 触发后禁止浏览器的后退键
> 
>               history.pushState(null, null, document.URL);
> 
>                 window.addEventListener("popstate",function(e) \{  
> 
>                     history.pushState(null, null, document.URL);
> 
>                 \}, false);

发表评论取消回复

表情：

评论列表（有 0 条评论，28人围观）

还没有评论，来说两句吧...

相关阅读

相关 VUE 项目集成Vuex，实现简单用户登入页面登入权限认证

第一步：VUE 项目安装Vuex 模块打开cmd 窗口指令，切换至VUE 项目所在路径地址，执行如下指令： cnpm install vuex --save 在

末蓝、/ 2023年10月10日 10:43/ 0 赞/ 120 阅读

相关网页中禁止使用鼠标右键操作

直接在前端加入下列代码即可实现。 <script type="text/javascript"> //禁止右键 document.oncont

秒速五厘米/ 2023年10月04日 05:24/ 0 赞/ 94 阅读

相关 vue开发app 手机物理返回键返回/退出

mui进行手机物理键的监听首先安装 vue-awesome-mui npm i vue-awesome-mui 在main.js注册 import Mui f

小咪咪/ 2023年07月18日 02:30/ 0 赞/ 92 阅读

相关 VUE 项目中退出登入后禁止返回键操作

HTML代码：（点击退出登录时触发 loginout命令,它在js中进行了监听） <el-dropdown class="user-name" trigger=

深碍√TFBOYSˉ_/ 2023年06月20日 10:45/ 0 赞/ 29 阅读

相关登入思考

一、传统的登入方式浏览器输入用户名密码，服务端校验通过，根据用户信息生成一个token，将token和user\_id存到数据库或者session中，并将toke

缺乏、安全感/ 2023年05月29日 02:50/ 0 赞/ 122 阅读

相关 android 接入极光一键登入

为什么要接入极光一键登入？理由：用户无需输入手机号码，一键点击即可快速完成注册/登录流程，提高转化率优化用户体验。应用场景注册登陆二次验证需要费用

梦里梦外;/ 2022年12月30日 03:35/ 0 赞/ 1086 阅读

相关按返回键提示是否退出

安卓机有效 setKeypadEnabled(true); 重载俩个虚函数做回应 //物理键 void KeyBackClicked();//点击返回响应

阳光穿透心脏的1/2处/ 2022年08月21日 11:51/ 0 赞/ 278 阅读

相关 Android按返回键不退出

@Override public boolean onKeyDown(int keyCode, KeyEvent event) \{ if (keyCode == Ke

Bertha 。/ 2022年08月08日 09:19/ 0 赞/ 310 阅读

相关单点登入登出

最近研究CAS，先从客户开始来说明CAS的逻辑，可能会结合源代码。必要说明：[http://blog.csdn.net/yuwenruli/article/details/

忘是亡心i/ 2022年08月06日 09:15/ 0 赞/ 393 阅读

相关 Android 双击返回键退出

双击返回键退出 //双击退出 @Override public boolean onKeyDown(int keyCode, KeyEvent e

水深无声/ 2022年06月13日 04:13/ 0 赞/ 344 阅读