logo

该视频仅会员有权观看

立即开通课程「Nuxt.js 前端应用开发实践」权限。

¥
199
/ 年

在 Nuxt 应用里实现退出登录

  • 实现退出登录功能:设置当前用户数据为no,清除浏览器本地存储的用户数据。
  • 创建useLogOut文件和函数,在compositions文件夹内。
  • useLogOut函数包含使用useState定义的currentUser变量及设置其值为no
  • 利用useLocalStorage删除本地存储的名为currentUser的数据。
  • default组件的登录图标下添加一个v-else指令的退出登录图像,并设置相关事件处理,通过useLogOut处理点击事件。
  • 点击退出登录小图标,当前用户状态会被设置为no,浏览器本地存储的用户数据也会被清除。