• 【1118 | Day61】Vue-CLI项目功能插件之vue-cookie


    一.模块的安装

    npm install vue-cookies --save
    #--save可以不用写
    

    二.配置main.js

    // 配置cookie
    import cookies from 'vue-cookies'
    Vue.prototype.$cookies = cookies;  //配置时候prototype.$这里的名字自己定义不是固定是cookies
    

    三.使用

    // 持久化存储val的值到cookie中
    this.$cookies.set('val', this.val, 300)
    
    // 获取cookie中val字段值
    this.$cookies.get('val')
    
    // 删除cookie键值对
    this.$cookies.remove('val')
    

    相关配置:

    • 到期时间全局设置
    这里是全局的设置所有的cookie都会生效
    this.$cookies.config('固定时间') //填的值1d为一天,1h为一小时,1min为一分钟,1s为1秒
    
    
    //指定时间
    this.$cookies.config(new Date(2020,12,1))
    this.$cookies.config("Sat, 13 Mar 2017 12:25:57 GMT")
    
    //如果是乘法
    this.$cookies.config(60*60) //是60s*60s依次类推
    
    //如果是单单空数组
    this.$cookies.config(60) //也是60S
    
    • 单个cookie设置
    //不写过期时间,默认为1天过期
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX")
    
    // 1天过期,忽略大小写
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX","1d")
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX","1D")
    
    // 以秒为单位,设置1天过去
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX",60 * 60 * 24)
    
    // 填写Date对象,明确指定过期时间
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX", new Date(2017, 03, 12))
    
    // 填写一个时间字符串,指定过期时间
    this.$cookies.set("user_session","25j_7Sl6xDq2Kc3ym0fmrSSk2xV2XkUkX", "Sat, 13 Mar 2017 12:25:57 GMT")
    
    //浏览器会话结束时过期
    this.$cookies.set("default_unit_second","input_value","0");
     
    //永不过期
    this.$cookies.set("default_unit_second","input_value",-1); 
    

    设置过期时间,输入字符串类型(字符均忽略大小写):

    Unit full name
    y year
    m month
    d day
    h hour
    min minute
    s second
  • 相关阅读:
    Java正则表达式的总结
    Mysql数据库操作语句总结
    Java 如何抛出异常、自定义异常
    Java获取系统时间的四种方法
    Mysql与Oracle区别
    Oracle与MySQL的SQL语句区别
    sql语句的各种模糊查询
    基于SpringCloud的Microservices架构实战案例
    一个人走的快,一群人才走的远
    那些会阻碍程序员成长的细节[2]
  • 原文地址:https://www.cnblogs.com/fxyadela/p/11885902.html
Copyright © 2020-2023  润新知