Install
$ npm install vuex-storage-share --save
# or
$ yarn add vuex-storage-share
import VuexStorageShare from 'vuex-storage-share'
const storagePlugin = VuexStorageShare({
storagePrefix: 'VUEX_STORAGE/',
predicate: ['SET_USER_INFO', 'SET_TOKEN', 'SET_USER_AVATAR'],
expires_in: 3600, // One hour, it has not yet been realized
storageListener({ type, payload }) {
const route = router.app._route
if (type === 'SET_USER_INFO') {
if (!(payload && payload.is_login) && route.path !== '/login') {
router.replace({
path: '/login',
query: {
redirect: route.fullPath
}
})
}
if ((payload && payload.is_login) && route.path === '/login') {
router.replace(route.query && route.query.redirect || '/home')
}
}
}
})
const store = new Vuex.Store({
state: {
userinfo: {
is_login: false
}
},
mutations: {
SET_USER_INFO(state, userinfo) {
userinfo.is_login = !!userinfo.id
state.userinfo = userinfo
}
},
modules: {
app,
user,
},
getters,
plugins: [
storagePlugin.subscriber
]
})
Option | Explain | Type | Default |
---|---|---|---|
storagePrefix | localStorage key prefix. It is also a unique identification. | String |
VUEX_STORAGE/ |
expires_in | Expiration time in seconds. | Number |
0 |
predicate | List of mutations to store and share. | Array |
[] |
storageListener | storageListener({ type, payload }) {} Whenever the store is persisted, return a mutation object. |
Function |
- |