先修改用户退出,中午有点困先改简单的

退出代码在src\layout\components\Navbar.vue代码如下,讲流程这里不需要修改

methods: {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
async logout() {
await this.$store.dispatch('user/logout')
this.$router.push(`/login?redirect=${this.$route.fullPath}`)
}
}

退出方法调用store\user.js的logout及resetToken,官方提供示例是post方式,abp退出是get方式请求

  logout({ commit, state, dispatch }) {
return new Promise((resolve, reject) => {
logout(state.token).then(() => {
commit('SET_TOKEN', '')
commit('SET_ROLES', [])
removeToken()
resetRouter() // reset visited views and cached views
// to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485
dispatch('tagsView/delAllViews', null, { root: true }) resolve()
}).catch(error => {
reject(error)
})
})
},

直接修改为

  logout({ commit, state }) {
return new Promise((resolve, reject) => {
removeToken()
resetRouter()
commit('RESET_STATE')
resolve()
})
},

把src\api\user.js中的logout方法访问url修改为以下代码

export function logout() {
return request({
url: '/api/account/logout',
method: 'get'
})
}

最后一步清除Token

  resetToken({ commit }) {
return new Promise(resolve => {
removeToken() // must remove token first
commit('RESET_STATE')
resolve()
})
}

测试点退出,返回登录页,并将cookie中的token清除成功

Abp Vnext3 vue-admin-template(二用户退出)的更多相关文章

  1. Vue模板语法(二)

    Vue模板语法(二) 样式绑定  class绑定 使用方式:v-bind:class="expression" expression的类型:字符串.数组.对象 1.2 style绑 ...

  2. 一步步使用SpringBoot结合Vue实现登录和用户管理功能

    前后端分离开发是当今开发的主流.本篇文章从零开始,一步步使用SpringBoot结合Vue来实现日常开发中最常见的登录功能,以及登录之后对用户的管理功能.通过这个例子,可以快速入门SpringBoot ...

  3. ECSHOP Inject PHPCode Into \library\myship.php Via \admin\template.php && \includes\cls_template.php Vul Tag_PHP_Code Execute Getshell

    目录 . 漏洞描述 . 漏洞触发条件 . 漏洞影响范围 . 漏洞代码分析 . 防御方法 . 攻防思考 1. 漏洞描述 PHP语言作为开源社区的一员,提供了各种模板引擎,如FastTemplate,Sm ...

  4. Vue小项目二手书商城:(四)详情页和购物车(emit、prop、computed)

    实现效果: 点击对应商品,对应的商品详情页出现,详情页里面还有“Add to cart”按钮和“×”退出按钮. 点击“Add to cart”可以将商品加入购物车,每件商品只能添加一次,如果把购物车的 ...

  5. flask设置cookie,设置session,模拟用户认证、模拟管理后台admin、模拟用户logout

    设置cookie HTTP协议是无状态的,在一次请求响应结束后,服务器不会留下关于客户端状态的信息.但是对于某些web程序来说,客户端的信息有必要被记住,比如用户的登录状态,这样就可以根据用户的状态来 ...

  6. 一字一句的搞懂vue-cli之vue webpack template配置

    webpack--神一样的存在.无论写了多少次,再次相见,仍是初见.有的时候开发vue项目,对尤大的vue-cli感激涕零.但是,但是,但是...不是自己的东西,真的很不想折腾.所以,我们就得深入内部 ...

  7. vue入门demo:用户管理3

    该入门demo是使用组件的方式实现,不涉及向后端发送请求 说明 把用户列表和添加用户拆分为两个组件,用户列表数据在父组件 获取用户列表:用户列表组件获取父组件的用户列表(父组件向子组件传值)1-1 1 ...

  8. vue学习笔记(二)vue的生命周期和钩子函数

    前言 通过上一章的学习,我们已经初步的了解了vue到底是什么东西,可以干什么,而这一篇博客主要介绍vue的生命周期和它常用的钩子函数,如果有学过java的园友可能有接触到在学习servlet的时候学过 ...

  9. ABP实践(4)-abp前端vue框架之简单商品增删改查(帮助刚入门的新手快速了解怎么才能加入自己的功能并运行起来)

    提示:如有不明白的地方请先查看前3篇ABP实践系列的文章 1,下载及启动abp项目前后端分离(netcore+vue) 2,修改abp数据库为mysql 3,商品系列api接口(本文主要依赖在这个商品 ...

随机推荐

  1. 将几张图片合并为一张图片,返回byte数组

    需求:通过url数组下载图片,再竖直合成一张新的图片,具体java代码如下 1 /** 2 * 竖直合并图片 3 * 4 * @param urls 5 * @return 6 */ 7 public ...

  2. Java流程控制01——用户交互Scanner

    用户交互Scanner sacnner对象 之前的语法并没有实现程序与人的交互.java.util.Scanner是Java5的新特征,我们可以通过Scanner类来获取用户的输入. 基本语法:  S ...

  3. [NumPy]文件的保存和加载

    如果想看.ipynb文件,那就借一步说话!

  4. Azure 实践(1)- Azure Devops Server 安装

    1.Azure Devops介绍 Azure DevOps Server 2020 (之前的名称为TFS),作为微软Azure DevOps 的企业私有(on-premises)服务器,是一个为开发团 ...

  5. 关于Algorithm in Nutshell源代码

    获取源码包 "Algorithm in Nutshell"的源码包ADK-1.0.zip在这本书主页上"Download Example Code"页面的Rel ...

  6. 基于ScheduledExecutorService的并发定时任务处理能力测试

    测试代码 定时器类 package business.util; import java.util.concurrent.Executors; import java.util.concurrent. ...

  7. WPF按钮实现水波纹效果

    xaml代码如下 <Button x:Class="UI.btn.ZButton" xmlns="http://schemas.microsoft.com/winf ...

  8. 客户端连接mysql数据库反应慢

    远程客户端连接MysqL数据库太慢解决方案 局域网客户端访问mysql 连接慢问题解决 编辑mysql配置文件 # vi my.conf [mysqld] skip-name-resolve 重启my ...

  9. mock平台介绍和moco的简单例子

    1.mock是什么?mock测试就是在测试过程中,对于某些不容易构造或者不容易获取的对象,用一个虚拟的对象来创建以便测试的测试方法.在具体的测试过程中,我们经常会碰到需要模拟数据或者接口的情况,因为环 ...

  10. QT从入门到入土(八)——项目打包和发布

    引言 新手上路可谓是困难重重,你永远不知道下一个困难会在什么时候出现,在完成了运动控制卡封装发布过程中可谓是举步维艰.因此记录一下qt5+vs2019的打包发布方法. 打包一般分为两步: 将编译后的e ...