精华内容
下载资源
问答
  • 数据存本地js方法文件 ... * put 把数据到本地存储 * @param {*} key * @param {*} value */ local.set = function (key, value) { window.localStorage.setItem(key, JSON.stringify(value)); }; /** * ge...

    数据存本地js方法文件

    const local =  {}
    /**
     * put 把数据放到本地存储
     * @param {*} key
     * @param {*} value
     */
    local.set = function (key, value) {
      window.localStorage.setItem(key, JSON.stringify(value));
    };
    /**
     * get 获取本地存储数据
     * @param {*} key
     */
    local.get = function (key) {
      var obj = window.localStorage.getItem(key);
      if (obj && obj != 'undefined' && obj != 'null') {
        return JSON.parse(obj);
      }
      return '';
    };
    /**
     * remove 清除本地数据
     * @param {*} key
     */
    local.remove = function (key) {
      if (key) {
        window.localStorage.removeItem(key);
      } else {
        for (var i in arguments) {
          window.localStorage.removeItem(arguments[i]);
        }
      }
    };
    /**
     * seek 检查本地是否有值
     * @param {*} key
     */
     local.seek = function (name) {
       if (!name) return;
       return window.localStorage.hasOwnProperty(name)
     }
    
    export default local
    

    我以Vue项目为参考做事例,若其他文件需要引用,则在其它页面按需引入即可。

    import local from "../../libs/local";  //依据自己页面实际路径为准
    

    接下来展示如何使用

    //数据存储本地
    local.set("areaDatas", data); //其中"areaDatas"为key,data为value
    //数据从本地取出
    local.get("areaDatas");
    //数据从本地清除
    local.remove('areaDatas');
    

    接下来为大家展示一个我所遇到的坑,当你想存一个ES6中的map去本地的话,计算机并不会如你所愿,你按照刚刚的做法得到的value将会是undefined

    click_areaCodeList() {
          let param = {
            getAll: 1
          };
          areaCodeList(param)
            .then(resp => {
              if (resp.data) {
                let data = resp.data.data;
                let map = new Map();
                for (let i = 0; i < data.length; i++) {
                  let key = map.get(data[i].code);
                  if (key == undefined) {
                    let arr = [];
                    arr.push(data[i].province, data[i].city, data[i].district);
                    map.set(data[i].code, arr);
                  } else {
                    key.push(data[i].code);
                    map.set(data[i].code, key);
                  }
                }
                local.set(
                  "xzqbmChangeList",
                  JSON.stringify(Array.from(map.entries()))  //你得这样才能存进去
                );
              }
            })
            .catch(error => {
              console.log(error);
            });
        }
    

    接下来就是取了,也有一点变化

    this.xzqbmChangeList = new Map(JSON.parse(local.get("xzqbmChangeList")));
    

    既然说到了Map,就为大家简单过一下map的添加键和读取值吧

    ES6之Map小解

    var myMap = new Map();
     
    var keyObj = {},
        keyFunc = function () {},
        keyString = "hzq";
     
    // 添加键
    myMap.set(keyString, "和键'hzq'关联的值");
    myMap.set(keyObj, "和键keyObj关联的值");
    myMap.set(keyFunc, "和键keyFunc关联的值");
     
    myMap.size; 
     
    // 读取值
    myMap.get(keyString);    // "和键'hzq'关联的值"
    myMap.get(keyObj);       // "和键keyObj关联的值"
    myMap.get(keyFunc);      // "和键keyFunc关联的值"
     
    myMap.get("hzq");        // "和键'hzq'关联的值"
                             // 因为keyString === 'hzq'
    myMap.get({});           // undefined, 因为keyObj !== {}
    myMap.get(function() {}) // undefined, 因为keyFunc !== function () {}
    

    最后说个小知识,如果你在不同页面向本地存储数据时,想存在一个对象里,你可以如下操作,

    //先从本地获取原有数据,如:
    _this.adressDatas = local.get('adressDataInfo');
    //然后在需要的地方定义一个新对象,如:var obj = {}  
    var obj = {..._this.adressDatas,...{
        bussAdress:_this.bussAdressAll.bussAdress,//企业地址
        bussAdressId:_this.bussAdressAll.bussAdressId,//企业地址id
        detailed:_this.bussAdressAll.detailed,//详细地址
       	userName:_this.bussAdressAll.userName,  //联系人姓名
        contactPhone:_this.bussAdressAll.contactPhone, //联系电话
        userEmail:_this.bussAdressAll.userEmail  //联系人邮箱
        }}
        // 写好后在把它存入本地,
        local.set('adressDataInfo',obj)
        //这样的话,本地中的数据都保存在这个adressDataInfo键值value下。
    

    本文章为原创,若转载请注明出处,喜欢的朋友请给个关注,谢谢

    展开全文
  • 1、dom结构说明: 【评论人、评论内容、发表评论... 发表评论的数据存到localStorage 中,关于localStorage ,说明几点: a. localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的; b....

    1、dom结构说明:

    【评论人、评论内容、发表评论】是子组件内容;评论列表是父组件内容;

    2、功能点:点击【发表评论】,最新评论的内容显示在评论列表的最上面,如何实现?

    分析:

    // 1. 发表评论的数据存到localStorage 中,关于localStorage ,说明几点:

    • a. localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的;
    • b. localStorage只支持string类型的存储
    • c. localStorage.setItem(key,value):将value存储到key字段,如果value是JSON对象,需要使用JSON.stringify()这个方法,来将JSON转换成为JSON字符串
    • d. localStorage.getItem(key):获取指定key本地存储的值
    • e. 如果需要将JSON字符串转为JSON,则使用JSON.parse()方法实现

    // 2. 先组织出一个最新的评论数据对象

    // 3. 在保存最新的评论数据之前,要先从 localStorage 获取到之前的评论数据(string),转换为一个数组对象;如果获取到的localStorage 中的评论字符串,为空不存在, 则可以返回一个 '[]' 让 JSON.parse 去转换;然后,把最新的评论,unshift到这个数组

    // 4. 把最新的评论列表数组,再次调用 JSON.stringify 转为 数组字符串,然后调用 localStorage.setItem()存储起来

    //5. 评论之后,把评论人、评论内容置空

    //6. 调用父组件传递的方法,向父组件传值

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
      <script src="./lib/vue-2.4.0.js"></script>
      <link rel="stylesheet" href="./lib/bootstrap-3.3.7.css">
      <style>
      .box{
        padding: 20px;
      }
      </style>
    </head>
    
    <body>
      <div id="app" class="box">
        <cmt-box @func="loadComments"></cmt-box>
        <ul class="list-group">
          <li class="list-group-item" v-for="item in list" :key="item.id">
            <span class="badge">评论人: {{ item.user }}</span>
            {{ item.content }}
          </li>
        </ul>
      </div>
      <!-- 和父组件平级放置,独立于app -->
      <template id="tmpl">
        <div>
          <div class="form-group">
            <label>评论人:</label>
            <input type="text" class="form-control" v-model="user">
          </div>
          <div class="form-group">
            <label>评论内容:</label>
            <textarea class="form-control" v-model="content"></textarea>
          </div>
          <div class="form-group">
            <input type="button" value="发表评论" class="btn btn-primary" @click="postComment">
          </div>
        </div>
      </template>
      <script>
        var commentBox = {
          data() {
            return {
              user: '',
              content: ''
            }
          },
          template: '#tmpl',
          methods: {
            postComment() { // 发表评论的方法
              var comment = { id: Date.now(), user: this.user, content: this.content }
              var list = JSON.parse(localStorage.getItem('cmts') || '[]')
              list.unshift(comment)
              localStorage.setItem('cmts', JSON.stringify(list))
              this.user = this.content = ''
              this.$emit('func')
            }
          }
        }
    
        // 创建 Vue 实例,得到 ViewModel
        var vm = new Vue({
          el: '#app',
          data: {
            list: []
          },
          created(){
            this.loadComments()
          },
          methods: {
            loadComments() { // 从本地的 localStorage 中,加载评论列表
              var list = JSON.parse(localStorage.getItem('cmts') || '[]')
            }
          },
          components: {
            'cmt-box': commentBox
          }
        });
      </script>
    </body>
    
    </html>

     

     

     

    展开全文
  • app.vue <template> <div id="app"> <router-view/> </div> </template> <script> export default { name: 'App' } </script> <style lang="less"> </...


     

    app.vue

    <template>
      <div id="app">
    
        <router-view/>
      </div>
    </template>
    <script>
    export default {
      name: 'App'
    }
    </script>
    <style lang="less">
    
    </style>
    

    index.vue

    <template>
      <div class="login-container">
        <!--必须用el-form进行包裹-->
        <div class="login-head"></div>
        <!--配置表单验证
        //必须为表单提供验证对象
        2添加prop属性
        3通过el-form组件库里面的rules-->
    
        <el-form class="login-form" ref="login-form" :model="user" :rules="formRules">
          <el-form-item prop="mobile">
            <el-input v-model="user.mobile" placeholder="请输入手机号"></el-input>
          </el-form-item>
    
            <el-form-item prop="code">
              <el-input v-model="user.code" placeholder="请输入验证码"></el-input>
            </el-form-item>
          <el-form-item prop="agree">
            <el-checkbox v-model="checked">我已阅读并同意用户协议和隐私条款</el-checkbox>
    
          </el-form-item>
          <el-form-item>
            <el-button class="login-btn" type="primary" :loading="loginLoading" @click="onLogin">登录</el-button>
    
          </el-form-item>
        </el-form>
      </div>
    </template>
    
    <script>
    
    import { login } from '@/api/user'
    export default {
      name: 'LoginIndex',
      components: {
      },
      props: {},
      data () {
        return {
          user: {
            mobile: '', // 手机号
            code: '', // 验证码
            agree: false// 是否同意协议
          },
    
          loginLoading: false, // 登录的loding状态
          /*  checked: false, // 是否同意协议 */
          formRules: {
            mobile: [{
              required: true,
              message: '手机号不能为空',
              trigger: 'change'
            },
            { pattern: /^1[3|5|7|9]\d{9}$/, message: '请输入正确的号码格式', trigger: 'change' }
            ],
            code: [{
              required: true,
              message: '验证码不能为空',
              trigger: 'change'
            },
            { pattern: /^\d{6}$/, message: '请输入正确的验证码格式', trigger: 'change' }
    
            ],
            agree: [{
              // 调用
              validator: (rule, value, callback) => {
                if (value) {
                  callback()
                } else {
                  callback(new Error('请同意用户协议'))
                }
              },
    
              trigger: 'change'
            }]
          }
        }
      },
      methods: {
        onLogin () {
          // 获取表单数据
          // const user = this.user
          // 触发表单验证 validate是异步
          this.$refs['login-form'].validate((valid, err) => {
            console.log(valid)
            console.log(err)
            // 如果
            if (!valid) {
              return
            }
            this.login()
          })
        },
        login () {
          // 开启loading
          this.loginLoading = true
          // 验证通过
          // 请求直接封装
          login(this.user).then(res => {
            console.log(res)
            this.$message({
              message: '登录成功',
              type: 'success'
    
            })
            this.loginLoading = false
          }).catch(err => {
            console.log('登录失败', err)
            this.$message.error({
              message: '手机号或者验证码错误',
              type: 'warning'
    
            })
            this.loginLoading = false
          })
        }
      }
    
    }
    </script>
    <style scoped lang="less">
    .login-container{
    position: fixed;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      background: url("./login_bg.jpg") no-repeat;
      background-size: cover;
      .login-head{
        width: 300px;
        height: 57px;
        background:url("./logo_index.png") no-repeat;
        margin-bottom: 30px;
      }
      .login-form{
        background-color: #fff;
        padding: 50px;
        min-width: 300px;
        .login-btn{
          width: 100%;
        }
      }
    }
    </style>
    

    main.js

    import Vue from 'vue'
    import App from './App.vue'
    import router from './router'
    import './styles/index.less'
    // 加载组件库
    import ElementUI from 'element-ui'
    // 加载样式
    import 'element-ui/lib/theme-chalk/index.css'
    Vue.config.productionTip = false
    // 注册组件库
    Vue.use(ElementUI)
    new Vue({
      router,
      render: h => h(App)
    }).$mount('#app')
    

    index.js

    import Vue from 'vue'
    import VueRouter from 'vue-router'
    import Login from '@/views/login/index'
    Vue.use(VueRouter)
    
    // 路由配置表
    const routes = [{
      path: '/login',
      name: 'login',
      component: Login
    }]
    const router = new VueRouter({
      routes
    })
    
    export default router
    

    user.js

    // 用户登录的请求模块
    import request from '@/utils/request'
    
    export const login = data => {
      return request({
        method: 'POST',
        url: '/mp/v1_0/authorizations',
        data
      })
    }
    
    // 获取用户信息
    export const getUserProfile = () => {
      const user = JSON.parse(window.localStorage.getItem('user'))
      console.log(user)
      return request({
        method: 'GET',
        url: '/mp/v1_0/user/profile',
        // axios通过headers
        headers: {
          Authorization: `Bearer ${user.token}`
        }
      })
    }
    

    index.vue

    <template>
      <div class="home-container">首页</div>
    </template>
    <script>
    export default {
      name: 'HomeIndex',
      data () {
        return {
    
        }
      }
    }
    </script>
    <style scoped lang="less">
    
    </style>
    

    index.vue

    <template>
      <div class="login-container">
        <!--必须用el-form进行包裹-->
        <div class="login-head"></div>
        <!--配置表单验证
        //必须为表单提供验证对象
        2添加prop属性
        3通过el-form组件库里面的rules-->
    
        <el-form class="login-form" ref="login-form" :model="user" :rules="formRules">
          <el-form-item prop="mobile">
            <el-input v-model="user.mobile" placeholder="请输入手机号"></el-input>
          </el-form-item>
    
            <el-form-item prop="code">
              <el-input v-model="user.code" placeholder="请输入验证码"></el-input>
            </el-form-item>
          <el-form-item prop="agree">
            <el-checkbox v-model="user.agree">我已阅读并同意用户协议和隐私条款</el-checkbox>
    
          </el-form-item>
          <el-form-item>
            <el-button class="login-btn" type="primary" :loading="loginLoading" @click="onLogin">登录</el-button>
    
          </el-form-item>
        </el-form>
      </div>
    </template>
    
    <script>
    
    import { login } from '@/api/user'
    export default {
      name: 'LoginIndex',
      components: {
      },
      props: {},
      data () {
        return {
          user: {
            mobile: '13911111111', // 手机号
            code: '246810', // 验证码
            agree: false// 是否同意协议
          },
    
          loginLoading: false, // 登录的loding状态
          /*  checked: false, // 是否同意协议 */
          formRules: {
            mobile: [{
              required: true,
              message: '手机号不能为空',
              trigger: 'change'
            },
            { pattern: /^1[3|5|7|9]\d{9}$/, message: '请输入正确的号码格式', trigger: 'change' }
            ],
            code: [{
              required: true,
              message: '验证码不能为空',
              trigger: 'change'
            },
            { pattern: /^\d{6}$/, message: '请输入正确的验证码格式', trigger: 'change' }
    
            ],
            agree: [{
              // 调用
              validator: (rule, value, callback) => {
                console.log(value)
                if (value) {
                  callback()
                } else {
                  callback(new Error('请同意用户协议'))
                }
              },
    
              trigger: 'change'
            }]
          }
        }
      },
      methods: {
        onLogin () {
          // 获取表单数据
          // const user = this.user
          // 触发表单验证 validate是异步
          this.$refs['login-form'].validate((valid, err) => {
            console.log(valid)
            console.log(err)
            // 如果
            if (!valid) {
              return
            }
            this.login()
          })
        },
        login () {
          // 开启loading
          this.loginLoading = true
          // 验证通过
          // 请求直接封装
          login(this.user).then(res => {
            console.log(res)
            this.$message({
              message: '登录成功',
              type: 'success'
    
            })
            this.loginLoading = false
            // 跳转到首页
            window.localStorage.setItem('user', JSON.stringify(res.data.data))
    
            // 将接口返回的数据接收
    
            this.$router.push({
              name: 'home'
            })
          }).catch(err => {
            console.log('登录失败', err)
            this.$message.error({
              message: '手机号或者验证码错误',
              type: 'warning'
    
            })
            this.loginLoading = false
          })
        }
      }
    
    }
    </script>
    <style scoped lang="less">
    .login-container{
    position: fixed;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      background: url("./login_bg.jpg") no-repeat;
      background-size: cover;
      .login-head{
        width: 300px;
        height: 57px;
        background:url("./logo_index.png") no-repeat;
        margin-bottom: 30px;
      }
      .login-form{
        background-color: #fff;
        padding: 50px;
        min-width: 300px;
        .login-btn{
          width: 100%;
        }
      }
    }
    </style>
    

    aside.vue

     

    <template>
      <!--
        el-menu-item 的 index 不能重复,确保唯一即可
       -->
      <el-menu
        class="nav-menu el-menu-vertical-demo"
        :default-active="$route.path"
        background-color="#002033"
        text-color="#fff"
        active-text-color="#ffd04b"
        router
        :collapse="isCollapse"
      >
        <el-menu-item index="/">
          <i class="el-icon-s-home"></i>
          <span slot="title">首页</span>
        </el-menu-item>
        <el-menu-item index="/article">
          <i class="el-icon-document"></i>
          <span slot="title">内容管理</span>
        </el-menu-item>
        <el-menu-item index="/image">
          <i class="iconfont iconimage"></i>
          <span slot="title">素材管理</span>
        </el-menu-item>
        <el-menu-item index="/publish">
          <i class="iconfont iconpublish"></i>
          <span slot="title">发布文章</span>
        </el-menu-item>
        <el-menu-item index="/comment">
          <i class="iconfont iconcomment"></i>
          <span slot="title">评论管理</span>
        </el-menu-item>
        <el-menu-item index="/fans">
          <i class="el-icon-setting"></i>
          <span slot="title">粉丝管理</span>
        </el-menu-item>
        <el-menu-item index="/settings">
          <i class="el-icon-setting"></i>
          <span slot="title">个人设置</span>
        </el-menu-item>
      </el-menu>
    </template>
    <script>
    export default {
      name: 'AppAside',
      methods: {
        handleOpen (key, keyPath) {
          console.log(key, keyPath)
        },
        handleClose (key, keyPath) {
          console.log(key, keyPath)
        }
      }
    }
    </script>
    <style scoped lang="less">
    .nav-menu {
      .iconfont {
        margin-right: 10px;
        padding-left: 5px;
      }
    }
    </style>
    

     运行结果

     

    展开全文
  • 1.原始的办法:在点击详情页的时候,记住浏览位置,传递参数或者存到本地缓存,然后在详情页操作完毕后,返回的时候,路由守卫可以判断,是否详情页跳转回来的,然后让页面滚动到上次记录的位置; 思路是这样,实际...
  • 原因: 系统登录成功之后,将信息...登录成功后,信息到vuex中的同时将数据用sessionStorage存储到本地,刷新页面之后将存储在本地的值重新赋值给vuex中 //将key存放入vuex _this.$store.state.key = _this.ruleF

    原因:

    系统登录成功之后,将信息保存在了vuex中的store中,当用vuex做全局状态管理的时候,store中的数据是保存在运行内存中的,页面刷新时会重新加载vue实例,store中的数据就会被重新赋值,触发created中方法条件未能满足,因此数据就丢失了

    解决方法:

    登录成功后,信息存到vuex中的同时将数据用sessionStorage存储到本地,刷新页面之后将存储在本地的值重新赋值给vuex中

    	//将key存放入vuex
    	_this.$store.state.key = _this.ruleForm.key;
    	//将key存放入sessionStorage
         sessionStorage.setItem('key',_this.ruleForm.key);
    
      created(){
    		//刷新获取到存储的值放到vuex中
      	if(this.$store.state.key=="" && sessionStorage.getItem("key")){
          this.$store.state.key = sessionStorage.getItem("key")
        }else{
        	//刷新 如果本地存储没有值 跳转到首页
           this.$router.push("/login");
        }
      }
    
    展开全文
  • 刷新页面时vue实例重新加载,store就会被重置,可以把定义刷新前把store存入本地localStorage、sessionStorage、cookie中,...当然,在页面刷新时还要读取sessionStorage中的数据到store中,读取和储存都写在app.vue
  • 搜索历史搜索过的关键词 保存在本地存储 localstorage 中,同时多个组件共享搜索历史数据,将数据存到vuex 中,初始值从本地缓存中取得对应key 的值,没有数据默认为空数组 点击搜索关键词列表值的时候触发将关键词...
  • 在本地新建cache.js文件,该文件是关于本地存储的逻辑处理(缓存到本地数据最大缓存15条,并且新的插入在第一位,首先得到当前的存储数据情况,将关键字到数组中,判断如果数组中有相同的数据,则把重复的数据删除...
  • 用到这个的业务场景是这样的: a页面点击新建列表按钮进入新建的页面b,填写b页面并点击b页面确认添加按钮,把这些数据带...用本地存储的时候,如果不加回退也会吧之前的历史记录给带过来,所以最终选用了第三种方
  • 解决vue刷新页面以后丢失store的数据

    千次阅读 2019-05-11 11:10:42
    刷新页面时vue实例重新加载,store就会被重置,可以把定义刷新前把store存入本地localStorage、sessionStorage、cookie中,localStorage是永久储存,重新打开页面时会读取上一次打开的页面数据,sessionStorage时...
  • 刷新页面vue实例重新加载,store被重置,可以把定义刷新前把store存入本地localStorage、sessionStorage、cookie中,localStorage是永久储存,重新打开页面时会读取上一次打开的页面数据,sessionStorage是储存...
  • 2、直接将登录后的值存储到本地,后台根据本地数据进行处理 第一种实现: beforeCreate(),created(), beforeMount(), mounted()一个vue只执行一次,浏览器刷新,必执行APP.Vue,所以可以把以下代码写到APP.vue中。 ...
  • 如果不可考虑本地缓存的话,就是获取state中数组,并把点击的值push进行数组,然后下这个数组替换掉state中的即可 而要存入本地缓存的话,即push进本地缓存,state则从本地缓存中获取。 操作稍微复杂因此,单独...
  • 1、存储搜索历史记录时使用good-storage 插件直接数组,因为原生的localstorage api 需要将数组转换为...新建cache.js本地存储相关的逻辑(缓存到本地数据最大缓存15条,并且新的插入在第一位,首先得到当前的...
  • vue实现搜索显示历史搜索记录,采用插件-good-storage安装插件npm install good-storage -S在本地新建cache.js文件,该文件是关于本地存储的逻辑处理(缓存到本地数据最大缓存15条,并且新的插入在第一位,首先得到...
  • vue实现搜索显示历史搜索记录,采用插件-good-storage安装插件npm install good-storage -S在本地新建cache.js文件,该文件是关于本地存储的逻辑处理(缓存到本地数据最大缓存15条,并且新的插入在第一位,首先得到...
  • 在本地新建cache.js文件,该文件是关于本地存储的逻辑处理(缓存到本地数据最大缓存15条,并且新的插入在第一位,首先得到当前的存储数据情况,将关键字到数组中,判断如果数组中有相同的数据,则把重复的数据删除...
  • 在uniapp项目的时候,想把数据存到一个文件里 在网上找的时候发现大家都转载的一样的代码,于是就写上我的 json导入本地数据 json.js里面 let data =[ { id:"14654651162162", title:"123" } ] module....
  • 前段时间做个webApp项目,给原生的webview用,项目使用vue-cli。一些数据全局数据用到了VUEX,比如登录状态,用户数据,可是测试的时候发现刷新...想到了本地存储,将一些登录信息存到本地,当页面刷新,vuex里数...
  • 1、页面之间的传参可以利用本地存储localStorage,将需要传过去...注意:如果页面之间是用v-if的形式切换的话,每次切换的时候都会重新加载数据,重新渲染页面,所以为了不频繁操作数据,可以判断本地存储中是否...
  • Vue的学习(7)

    2020-01-18 10:21:24
    存储数据 在昨日基础上修改下,来... //这里感觉可以想成这样,先以json数据形式存到本地, // 然后通过通过读取并转义json为javascript对象,这里是变成了数组 //会以数组形式 //从localstorage读取todos ...
  • 前言 项目需求,需要vuex进行路由持久...实现缓存信息到本地 nuxtjs中store不能直接使用浏览器的lcoalStorage方法, 而且自己写数据同步功能比较麻烦, 所以我们需要依赖一个插件vuex-persistedstate,该插件会把本地
  • 尝试了很多方法,最后发现最原始的把当前状态存到本地存储也是可以实现的, 我一开始用的这个方法但是没有生效,原因是什么呢,很简单 数据是Number类型,到Loaclstorage之后再取出来变成了string 可以明显看到两...
  • 问题 : 在vue项目中,刷新页面之后,之前的登录信息, 打开的... 将vuex里面的数据同步更新 localStorage/sessionStorage里存储 以登录信息为例: 每次登录成功, 将用户名进webstorage(根据具体需求去选择localSt...
  • 前文 已经完成这个架子的搭建 关于登录 ...mock中有路由数据 github 地址 https://github.com/nan1010082085/Vue-Asgin.git coding 地址 https://git.dev.tencent.com/nan1010082085/vue-asgin.gi...

空空如也

空空如也

1 2
收藏数 40
精华内容 16
关键字:

vue存数据到本地

vue 订阅