简单介绍Vue中使用js-cookie详情
一、安装js-cookie
cnpm i -S js-cookie
二、使用
1、局部使用
import Cookies from "js-cookie";
示例:
当前token: {{token}} getToken setToken removeToken import Cookies from "js-cookie"; export default { components: {}, data() { return { token: "" }; }, methods: { getToken() { this.token = Cookies.get("token"); }, setToken(token) { Cookies.set("token", token); }, removeToken: () => Cookies.remove("token") } };
效果:
如果想要设置有效期,添加expires属性即可,单位为天。即:
setToken(token) { Cookies.set("token", token, { expires: 7 }); //有效期为7天 }
获取所有Cookie函数:Cookies.get();
2、全局使用
main.js中引入:
import Cookies from "js-cookie"; Vue.prototype.$cookie = Cookies;
使用:
当前token: {{token}} getToken setToken removeToken export default { data() { return { token: "", allCookies: "" }; }, methods: { getToken() { this.token = this.$cookie.get("token"); }, setToken(token) { this.$cookie.set("token", token, { expires: 7 }); //有效期为7天 }, removeToken() { this.$cookie.remove("token"); } } };
注意:全局使用js-cookie时,这里的removeToken函数就不要用箭头函数了,就用普通的函数写法
到此这篇关于Vue中使用js-cookie详情的文章就介绍到这了。