Browse Source

feat: add pinia persist plugin

main
xingyu 2 years ago
parent
commit
7015287a6f
  1. 1
      package.json
  2. 11
      pnpm-lock.yaml
  3. 1
      src/components/Loading/src/createLoading.ts
  4. 2
      src/store/index.ts
  5. 38
      src/store/plugin/persist.ts

1
package.json

@ -66,6 +66,7 @@
"nprogress": "^0.2.0", "nprogress": "^0.2.0",
"path-to-regexp": "^6.2.1", "path-to-regexp": "^6.2.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"pinia-plugin-persistedstate": "^3.2.0",
"print-js": "^1.6.0", "print-js": "^1.6.0",
"qs": "^6.11.2", "qs": "^6.11.2",
"resize-observer-polyfill": "^1.5.1", "resize-observer-polyfill": "^1.5.1",

11
pnpm-lock.yaml

@ -65,6 +65,9 @@ dependencies:
pinia: pinia:
specifier: ^2.1.7 specifier: ^2.1.7
version: 2.1.7(typescript@5.2.2)(vue@3.3.4) version: 2.1.7(typescript@5.2.2)(vue@3.3.4)
pinia-plugin-persistedstate:
specifier: ^3.2.0
version: 3.2.0(pinia@2.1.7)
print-js: print-js:
specifier: ^1.6.0 specifier: ^1.6.0
version: 1.6.0 version: 1.6.0
@ -7847,6 +7850,14 @@ packages:
dev: true dev: true
optional: true optional: true
/pinia-plugin-persistedstate@3.2.0(pinia@2.1.7):
resolution: {integrity: sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==}
peerDependencies:
pinia: ^2.0.0
dependencies:
pinia: 2.1.7(typescript@5.2.2)(vue@3.3.4)
dev: false
/pinia@2.1.7(typescript@5.2.2)(vue@3.3.4): /pinia@2.1.7(typescript@5.2.2)(vue@3.3.4):
resolution: {integrity: sha512-+C2AHFtcFqjPih0zpYuvof37SFxMQ7OEG2zV9jRI12i9BOy3YQVAHwdKtyyc8pDcDyIc33WCIsZaCFWU7WWxGQ==} resolution: {integrity: sha512-+C2AHFtcFqjPih0zpYuvof37SFxMQ7OEG2zV9jRI12i9BOy3YQVAHwdKtyyc8pDcDyIc33WCIsZaCFWU7WWxGQ==}
peerDependencies: peerDependencies:

1
src/components/Loading/src/createLoading.ts

@ -21,7 +21,6 @@ export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElemen
vm = createVNode(LoadingWrap) vm = createVNode(LoadingWrap)
if (wait) { if (wait) {
// TODO fix https://gitee.com/xingyuv/issues/438
setTimeout(() => { setTimeout(() => {
render(vm, document.createElement('div')) render(vm, document.createElement('div'))
}, 0) }, 0)

2
src/store/index.ts

@ -1,7 +1,9 @@
import type { App } from 'vue' import type { App } from 'vue'
import { createPinia } from 'pinia' import { createPinia } from 'pinia'
import { registerPiniaPersistPlugin } from '@/store/plugin/persist'
const store = createPinia() const store = createPinia()
registerPiniaPersistPlugin(store)
export function setupStore(app: App<Element>) { export function setupStore(app: App<Element>) {
app.use(store) app.use(store)

38
src/store/plugin/persist.ts

@ -0,0 +1,38 @@
/**
* Pinia Persist Plugin
* Pinia
* @link https://prazdevs.github.io/pinia-plugin-persistedstate/zh/guide/
*
*/
import type { Pinia } from 'pinia'
import { createPersistedState } from 'pinia-plugin-persistedstate'
import type { PersistedStateFactoryOptions } from 'pinia-plugin-persistedstate'
import { getCommonStoragePrefix } from '@/utils/env'
export const PERSIST_KEY_PREFIX = getCommonStoragePrefix()
// TODO customSerializer
/**
* Register Pinia Persist Plugin
* Pinia
*
* @param pinia Pinia instance Pinia
*/
export function registerPiniaPersistPlugin(pinia: Pinia) {
pinia.use(createPersistedState(createPersistedStateOptions(PERSIST_KEY_PREFIX)))
}
/**
* Create Persisted State Options
*
*
* @param keyPrefix prefix for storage key
* @returns persisted state factory options
*/
export function createPersistedStateOptions(keyPrefix: string): PersistedStateFactoryOptions {
return {
storage: localStorage,
key: id => `${keyPrefix}__${id}`,
}
}