VueJS 保存cookie信息

vuejs存cookie

1、安装

npm install js-cookie

2、存取cookie信息

我以存取用户语言信息为例。set将lang信息存入字段user_lang中，取的时候判断一下user_lang中是否有值，没有的话就返回传入的初始值。

新建lang.js文件：

export default {
  setLang(lang) {
    window.localStorage.setItem('user_lang', lang)
  },
  getLang(defaultLang) {
    let localLang = window.localStorage.getItem('user_lang')

    if (localLang === null) {
      return defaultLang
    } else {
      return localLang
    }
  }
}

3、执行set

在components中先import

import LangStorage from './../helpers/lang'

然后函数中执行set：

changeLocale() {
  let locale = this.$i18n.locale
  locale === 'zh' ? this.$i18n.locale = 'en' : this.$i18n.locale = 'zh'
  LangStorage.setLang(this.$i18n.locale) // 保存用户习惯
}

4、调用get

在main.js（或components）等需要用到地方中先import

import LangStorage from './helpers/lang'

然后调用get：

const i18n = new VueI18n({
  locale: LangStorage.getLang('zh'),  // 获取用户习惯或初始值
  messages: {
    'zh': require('./common/lang/zh'),
    'en': require('./common/lang/en')
  }
})

The end.