vue中 sessionStorage 的使用

﹏ヽ暗。殇╰゛Y 2023-02-24 11:06 12阅读 0赞

[精选30+云产品，助力企业轻松上云！>>> ![hot3.png][]][30_ _hot3.png]

不多说, 直接上代码, 看了你就会用了。

使用登录举例：

<template>
      <div>
        <el-form ref="form" :model="user" label-width="80px">
          <el-form-item label="账号">
            <el-input v-model="user.username"></el-input>
          </el-form-item>
          <el-form-item label="密码">
            <el-input v-model="user.password"></el-input>
          </el-form-item>
          <el-button type="primary" @click="login">登录</el-button>
        </el-form>
      </div>
    </template>
    
    <script>
    import axios from "axios";
    axios.defaults.baseURL = "http://localhost:8080";
    export default {
      data() {
        return {
          user: {}
        };
      },
      methods: {
        async login() {
          let { data } = await axios.post("/user/login", this.user);
          if (data.code == 1) {
            this.$message.success(data.message);
            //key   value  存储
            sessionStorage.setItem("token", this.user.username);
            // 通过key 获取
            let token = sessionStorage.getItem("token");
            this.$message.info(token);
            this.$router.push("/home");
          } else {
            this.$message.error(data.message);
          }
        }
      }
    };
    </script>
    
    <style>
    body {
      text-align: center;
    }
    </style>

[hot3.png]: /images/20230209/12b223c7519d4bf3865160e1e53eb2a5.png
[30_ _hot3.png]: https://www.oschina.net/action/visit/ad?id=1221

发表评论取消回复

表情：

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

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

相关阅读

相关 JavaScript中的sessionStorage

JavaScript中的sessionStorage 该文章需要联系这篇文章学习：[JavaScript中的localStorage ][JavaScript_loc

àì夳堔傛蜴生んèń/ 2024年03月31日 16:07/ 0 赞/ 47 阅读

相关【Vue】浏览器缓存sessionStorage、localStorage、Cookie

目录一、sessionStorage 1、简介 2、方法 3、代码示例 a、存取单个数据 b、存取对象 c、清除数据二、localStorage 1、简介

以你之姓@/ 2024年03月27日 15:24/ 0 赞/ 75 阅读

相关使用sessionStorage和localStorage

sessionStorage和localStorage是html5的新特性，和cookie一样，sessionStorage和localStorage也用于客户端存储数据，同样

矫情吗；*/ 2023年06月25日 06:08/ 0 赞/ 15 阅读

相关 vue中 sessionStorage 的使用

[精选30+云产品，助力企业轻松上云！>>> ![hot3.png][]][30_ _hot3.png] 不多说, 直接上代码, 看了你就会用了。使用登录举例：

﹏ヽ暗。殇╰゛Y/ 2023年02月24日 11:06/ 0 赞/ 13 阅读

相关实际中使用Javascript中sessionStorage的注意事项

平常时候使用sessionStorage，只是相当于把他当做临时的缓存，当用户在页面间跳转的时候可以共享数据。但如果细细分析，sessionStorage还是有一些注意事项

比眉伴天荒/ 2022年12月28日 12:53/ 0 赞/ 224 阅读

相关 java sessionstorage_sessionStorage的使用

一、需求场景：一个文件资源器的功能： 1、前端页面选择特定路径中的数据(使用Ztree) 2 、由服务器对该数据进行解析，按照自定义的模型将其包装成一个Json返回给前端(

一时失言乱红尘/ 2022年11月08日 11:52/ 0 赞/ 154 阅读

相关 vue项目登录使用sessionStorage

定义和使用 localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。 sessionStorage 用于临时保

àì夳堔傛蜴生んèń/ 2022年09月05日 04:09/ 0 赞/ 151 阅读

相关 vue sessionStorage存值取值问题

定义和使用 localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。 sessionStorage 用于临时保

墨蓝/ 2022年09月02日 00:51/ 0 赞/ 247 阅读

相关 vue-sessionstorage

> Install npm install --save vue-sessionstorage > main.js import VueSessionS

浅浅的花香味﹌/ 2022年02月02日 10:53/ 0 赞/ 206 阅读

相关 sessionStorage与localStorage的使用

判断浏览器是否该对象 if(typeof(Storage)!=="undefined") { // 是的! 支持 } els

╰半橙微兮°/ 2022年01月27日 16:59/ 0 赞/ 218 阅读