大家好我是前端新手小猿同学: 这篇文章主要给大家简单介绍一下在Vue项目中封装cookie、localStorage工具类希望对大家的学习进步有所帮助,当然文章中可能存在理解不正确的地方希望大家可在评论区相互讨教,共同进步。。 **1.与static文件同级新建utils文件夹,在utils文件夹下创index.js文件, 在main.js中引入utils文件。**
javascript">import utils from './utils'
Vue.use(utils);
在index.js中定义工具类
javascript">let prototype = {
//1.localStorage工具类
$setStroage(key,value){
window.localStorage.setItem(key,value)
}
$getStroage(key){
window.localStorage.getItem(key)
}
$removeStroage(key){
window.localStorage.removeItem(key)
}
//2.cookie工具类
$setCookie(cname, cvalue, exdays) {
//exdays 过期时间
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
var expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
$getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); }
}
return ""
}
$delCookie (name) {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval = this.$getCookie(name);
if (cval != null)
document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
};
}
let utils = function (Vue) {
for (let i in prototype) {
Vue.prototype[i] = prototype[i]
}
};
export default utils
使用:
javascript">this.$setStroage('name','张三')
this.$getStroage('name')