localstorage | 易学教程

前端如何设置一天只能点击一次的以及如何去判断第二天0点刷新的一些问题

阅读更多关于前端如何设置一天只能点击一次的以及如何去判断第二天0点刷新的一些问题

当需要在前端去判断一天只能点击一次，第二天0点重置的时候，该如何去解决呢？一、首先你需要获取第二天0点的时间，目前我的方法有两种 1.原生 var time= new Date(); time.setDate(t.getDate() + 1); time.setHours(0); time.setMinutes(0); time.setSeconds(0); console.log(t.getTime()) //第二天0点以毫秒为单位的时间 2.引入moment.js var t = moment().format('x')//当前点击时间 var nextDate = moment().add(1, 'days').hours(0).minutes(0).seconds(0).format('x')//新一天的时间二、使用localStorage或者cookie去存储一些数据设置过期时间为（第二天0点的时间 - 第一次点击的时间）这里我用到的是localStorage，由于localStorage原型上自带的属性方法里没有设置过期时间，需要自己封装两个方法用来存和取 Storage.prototype.setExpire = (key, value, expire) => { //设置存 let obj = { data: value, //要存的信息 time:

vue-cli3抽离配置文件

阅读更多关于 vue-cli3抽离配置文件

　　由于项目有外部部署需求，对不同的环境前端调用后台的地址不一样，且不能提前预知必须到部署现场后才能确定后端地址，故需要将调用后端相关的配置抽离到文件中，打包后部署人员在方便现场修改。　　思路如下：　　1.由于项目中vue初始化部分有很多网络请求，所以必须在加载vue的内容之前引入配置，为解决异步请求问题直接在public/index.html的header中引入配置（vue在body后注入）。　　2.配置放在js文件中，js文件中将配置对象放到localStorage中。有方法是将配置对象赋值给window顶级对象，感觉这样不安全，故采用放到localStorage的方式。　　3.在需要使用配置的地方，反序列化localStorage，取出其中的配置项使用。　　操作方法：　　来源： https://www.cnblogs.com/wurijie/p/11904242.html

Vue 组件

阅读更多关于 Vue 组件

Vue组件根组件 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="app"> {{ msg }} </div> </body> <script src="js/vue.js"></script> <script> /** * 1、组件：由html、css、js三部分组成的独立单位，可以类似于变量，重复使用 * 2、组件其实就是vue实例(对象)，一个组件就是一个vue实例(对象) * 3、new Vue()产生的也是实例(对象)，所以也是组件，我们称之为根组件 * 一个页面建议只出现一个根组件（项目开发模式下，一个项目建议只出现一个根组件） * 4、组件的html页面结构有 template 实例成员提供 * template提供的html结构是用来构虚拟DOM * 真实DOM最终会被虚拟DOM替换 * 根组件一般不提供template，就由挂载点el来提供构建虚拟DOM的页面结构，根组件如果提供了template，还需要设置挂载点作为替换占位 * template模板有且只有一个根标签 */ let c1 = ''; new Vue({ el: '#app', data: { msg: '12345', c1: 'red

转载（localStorage设置过期时间）

阅读更多关于转载（localStorage设置过期时间）

转载地址： https://blog.csdn.net/zhaoxiang66/article/details/86703438 class Storage{ constructor(name){ this.name = 'storage'; } //设置缓存 setItem(params){ let obj = { name:'', value:'', expires:"", startTime:new Date().getTime()//记录何时将值存入缓存，毫秒级 } let options = {}; //将obj和传进来的params合并 Object.assign(options,obj,params); if(options.expires){ //如果options.expires设置了的话 //以options.name为key，options为值放进去 localStorage.setItem(options.name,JSON.stringify(options)); }else{ //如果options.expires没有设置，就判断一下value的类型 let type = Object.prototype.toString.call(options.value); //如果value是对象或者数组对象的类型，就先用JSON.stringify转一下

Vue项目中添加锁屏功能

阅读更多关于 Vue项目中添加锁屏功能

0. 直接上预览链接 Vue项目中添加锁屏功能 1. 实现思路 ( 1 ) 设置锁屏密码 ( 2 ) 密码存localStorage （本项目已经封装h5的sessionStorage和localStorage） ( 3 ) vuex设置 SET_LOCK state.isLock = true (为true是锁屏状态) ( 4 ) 在路由里面判断vuex里面的isLock（为true锁屏状态不能让用户后退url和自行修改url跳转页面否则可以）（1）设置锁屏密码 handleSetLock() { this.$refs['form'].validate(valid => { if (valid) { this.$store.commit('SET_LOCK_PASSWD', this.form.passwd) this.handleLock() } }) }, （ 2 ) 密码存localStorage setStore 是自己封装的方法 SET_LOCK_PASSWD: (state, lockPasswd) => { state.lockPasswd = lockPasswd setStore({ name: 'lockPasswd', content: state.lockPasswd, type: 'session' }) }, ( 3 ) vuex设置 SET

web简历

阅读更多关于 web简历

在线演示： http://139.196.87.48:9002/brilliant/ 选择模板首先多多百度、谷狗一下，寻找到一款心仪的模板，注意关注一下模板使用的技术要适合自己为宜，以运行环境简单为宜，最好是纯HTML，只要一个浏览器就可以查看。如果是使用到bootstrap、vue、angular等相关技术的模板，就可能需要在修改或安装部署的时候对相关技术有所了解了，下面是我模板之家找到的一款个人网站模板。模板提供：模板之家模板名称：亮绿色前端工程师web简历模板下载地址： http://www.cssmoban.com/cssthemes/7585.shtml 整个网站简洁美观，颜色清新，富有个性化，使用的技术也比较简单，只要用浏览器就能直接查看，很适合用来打造个人网站。网站包含基础信息、工作经验、教育经历、专业技能、作品展示等模块，我们可以根据自己的需要进行适当添加、删除和修改。基础信息基础信息页面。工作经验工作经验页面。专业技能专业技能页面。业务分析 1.为了方便定制信息，我们决定把页面展示信息集中抽取到JSON文件，页面读取JSON文件信息进行展示。 2.将信息都抽取到JSON文件，当我们需要定制或修改简历信息的时候直接修改对应的JSON文件即可生效。 3.一般我们除了中文简历，有时也需要用到英文简历，所以我们的目标还要能支持中英文简历可以切换。

localStorage中一个数组嵌套一个数组的怪相

阅读更多关于 localStorage中一个数组嵌套一个数组的怪相

localStorage中一个数组嵌套一个数组的怪相需求：向本地存储中循环添加对象思路：先完成点击事件中添加本地存储功能，当刷新时使用一个数组记录已经存储下来的数据，并在点击事件中将新生成的数组push进去，实现数据的添加。第一版代码 let btn = document.querySelector("button"); function Obj() { this.a=1; this.address='none'; this.mail='none' } let i = 0; let arr = []; let gettext = JSON.parse(localStorage.getItem("text")); // 注意 gettext ? arr.push(gettext) : arr = []; console.log(arr); btn.onclick = function(){ let obj = new Obj(); obj.a = i; arr.push(obj); console.log(arr); localStorage.setItem("text",JSON.stringify(arr)); i++; } 按照之前思路列出了代码，在浏览器中查看存储下来的数据时却发现如下现象数组发生嵌套，arr[0]和1中都嵌套了多层代码

localStorage.getItem

阅读更多关于 localStorage.getItem

localStorage.getItem WEB应用的快速发展，是的本地存储一些数据也成为一种重要的需求，实现的方案也有很多，最普通的就是cookie了，大家也经常都用，但是cookie的缺点是显而易见的，其他的方案比如：IE6以上的userData，Firefox下面的globalStorage，以及Flash的本地存储，除了Flash之外，其他的几个都有一些兼容性的问题。 sessionStorage与localStorage Web Storage实际上由两部分组成：sessionStorage与localStorage。 sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。 localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。 userData 语法： XML <Prefix: CustomTag ID=sID STYLE="behavior:url('#default#userData')" /> HTML <ELEMENT STYLE="behavior:url('#default#userData')" ID=sID> Scripting object

json.stringify()的妙用，json.stringify()与json.parse()的区别

阅读更多关于 json.stringify()的妙用，json.stringify()与json.parse()的区别

一、 JSON.stringify()与JSON.parse()的区别最近做项目，发现JSON.stringify()使用场景真的挺多，我们都知道 JSON.stringify()的作用是将 JavaScript 对象转换为 JSON 字符串，而 JSON.parse()可以将JSON字符串转为一个对象。简单点说，它们的作用是相对的，我用 JSON.stringify()将对象a变成了字符串c，那么我就可以用 JSON.parse()将字符串c还原成对象a。 let arr = [1,2,3]; JSON.stringify(arr);//'[1,2,3]' typeof JSON.stringify(arr);//string let string = '[1,2,3]'; console.log(JSON.parse(string))//[1,2,3] console.log(typeof JSON.parse(string))//object 在使用 JSON.parse() 需要注意一点，由于此方法是将JSON字符串转换成对象，所以你的字符串必须符合JSON格式，即键值都必须使用双引号包裹： let a = '["1","2"]'; let b = "['1','2']"; console.log(JSON.parse(a));// Array [1,2]

Js 操作浏览器本地存储对象：HTML5 localstorage

阅读更多关于 Js 操作浏览器本地存储对象：HTML5 localstorage

Localstorage原生是只存储字符串的内容，如果想直接存储JSON或者是Array时是不可行。但是我们通过一些技巧来存储这些内容；通常一般性的代码如下： //json对象 var testObject = { "one": 1,"two": 2, "three": 3 }; // 存储对象到localstorage中 localStorage.setItem('testObject', JSON.stringify(testObject)); //从localstorage中获取数据 var retrievedObject = localStorage.getItem('testObject'); console.log('retrievedObject: ', JSON.parse(retrievedObject)); 如果每次这样操作，会很烦，因为你需要不断的重复转换成字符串，解析字符串。为了解决这个问题，我们可以通过扩展prototype原型 var Storage=window.localStorage Storage.__proto__.setObject = function(key, value) { this.setItem(key, JSON.stringify(value)); } Storage.__proto__.getObject =

订阅 localstorage