取出window.sessionStorage中的用户信息

我在登录页面上放了window.sessionStorage,想取出存在里面的username,nickname,mail,role在个人中心使用，请问应该怎么取出使用呢？
我的登录代码如下：

handleSubmit:function (){
      this.$refs.userLoginFormRef.validate(async valid => {
        if(!valid) return;
        const{data: res} = await this.$http.post("login",this.userLoginForm);
        if ( res.flag == "ok"){
            Cookies.set('username',this.userLoginForm.username)
            window.sessionStorage.setItem("user",res.user);//存储user对象
            this.$message.success("登陆成功~");
            this.$router.push({path:"/Home"});

        }else {
          this.$message.error("登录失败~");
        }
      })
    }

个人中心表格代码如下：

class="right" style="float:right;width:640px;">
            table :data="tableInfo" border height="140">
              table-column prop="username" label="用户账号">table-column>
              table-column prop="nickname" label="用户昵称">table-column>
              table-column prop="email" label="用户邮箱">table-column>
              table-column prop="roles" label="用户角色" width="150">table-column>
            table>

window.sessionStorage.getItem("user");这样获取，如果你存储的user是js对象的话需要先转为json字符串存储

// 假设 res.user 为以下对象
const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

// 将 user 对象存储到浏览器会话存储中
window.sessionStorage.setItem("user", JSON.stringify(user));
// 获取名为 user 的对象
const storedUser = window.sessionStorage.getItem("user");
if (storedUser) {
  const user = JSON.parse(storedUser);
  console.log(user);
}

window.sessionStorage.getItem("user"); 打印一下。你存的时候转换json字符串再存，取需要转换为json

以上说的获取方式是对的，如果你存储的是对象的话，需要将其序列化成字符串再进行存储，然后在读取时再反序列化回来

你可以使用window.sessionStorage.getItem(key)方法从sessionStorage中获取对应的值，其中key是存储时设置的键名。针对你的需求，可以通过以下代码取出对应的值：

var username = window.sessionStorage.getItem("username");
var nickname = window.sessionStorage.getItem("nickname");
var mail = window.sessionStorage.getItem("mail");
var role = window.sessionStorage.getItem("role");

然后你就可以在个人中心使用这些变量了。需要注意的是，以上代码只是获取了sessionStorage中存储的字符串值，如果需要使用数值类型，需要进行类型转换。

文章：本地存储：window.sessionStorage的特性和使用方法中也许有你想要的答案，请看下吧
除此之外, 这篇博客: 原生js本地存储中的 window.sessionStorage 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:

1、生命周期为关闭浏览器窗口
2、在同一个窗口（页面）下数据可以共享
3、以键值对的形式存储使用

<body>
  <input type="text">
  <button>存储数据</button>
  <button>获取数据</button>
  <button>删除数据</button>
  <button>清空数据</button>
  <script>
    var input = document.querySelector('input');
    var btn = document.querySelectorAll('button');
    // 存储
    btn[0].onclick = function () {
      var text = input.value;
      // 存储数据 key , value
      sessionStorage.setItem('text', text);
    }
    // 获取
    btn[1].onclick = function () {
      // 获取数据 key
      console.log(sessionStorage.getItem('text'));
    }
    // 删除
    btn[2].onclick = function () {
      // 删除数据 key
      sessionStorage.removeItem('text');
    }
    // 清空
    btn[3].onclick = function () {
      // 清空所有数据
      sessionStorage.clear();
    }
  </script>
</body>