diff --git a/src/components/App/Header/UserInfo.vue b/src/components/App/Header/UserInfo.vue
index 2ee3b24..658508a 100644
--- a/src/components/App/Header/UserInfo.vue
+++ b/src/components/App/Header/UserInfo.vue
@@ -8,7 +8,10 @@
         <i class="el-icon-tickets"></i>
         <span slot="title">{{text.userCenter}}</span>
       </el-menu-item>
-      <el-menu-item index="/logout">
+      <el-menu-item
+        index="/logout"
+        @click="logout($router.replace.bind($router))"
+      >
         <i class="el-icon-circle-close-outline"></i>
         <span slot="title">{{text.logout}}</span>
       </el-menu-item>
@@ -28,7 +31,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapActions } from 'vuex'
 
 export default {
   data () {
@@ -48,6 +51,12 @@ export default {
     ...mapState('login', [
       'userInfo'
     ])
+  },
+
+  methods: {
+    ...mapActions('login', [
+      'logout'
+    ])
   }
 }
 </script>
diff --git a/src/store/modules/login/actions.js b/src/store/modules/login/actions.js
index 649b8d0..b2a2439 100644
--- a/src/store/modules/login/actions.js
+++ b/src/store/modules/login/actions.js
@@ -1,5 +1,5 @@
 import { pushLogin, fetchUserInfo } from 'SERVICES'
-import { setTokenToLocal } from 'AUTH'
+import { setTokenToLocal, removeToken } from 'AUTH'
 import { dynamicRoutes } from 'ROUTER/routes'
 import types from './mutations/types'
 import { Notification } from 'element-ui'
@@ -62,6 +62,18 @@ export default {
       : filterRoutes(dynamicRoutes, role)
 
     commit(types.SET_ROUTES, globalRoutes)
+  },
+  logout ({ commit }, replace) {
+    commit(types.SET_USER_INFO, {})
+    commit(types.SET_USERNAME, '')
+    commit(types.SET_ROLE, [])
+    commit(types.SET_TOKEN, '')
+    removeToken()
+    replace('/')
+    Notification.success({
+      title: 'Success',
+      message: '用户已注销'
+    })
   }
 }