GithubHelp home page GithubHelp logo

pinia-persist-own's Introduction

Pinia Persist Own

一个Pinia的数据持久化插件

使用

安装

# npm
npm i pinia-persist-own
# pnpm
pnpm add pinia-persist-own

使用

import { persist, createPersist } from 'pinia-persist-own'
import { createPinia } from 'pinia'

const pinia = createPinia()

// 这里传入的是公共参数,每个 store 均共享此参数
const createPersist = persist(/* 可进行传递通用参数 */)

/**
 * 如果不想进行统一设置参数的话,可以直接使用导出的 'createPersist' 
 * 每个 store 均可以进行单独进行配置,单独的配置要优先于公用配置
 * 
 */

// 添加持久化
pinia.use(createPersist)

app.use(pinia)

通用参数

  • 类型: Object

    options = { 
      	// 使用何种方式进行持久化, 默认: sessionStorage
      	storage: window.sessionStorage
      	// 持久化时,是否启用加密,需自行加密, 默认: false
      	// 当 useCrypt 为 true 时,加密解密方法必传
      	useCrypt: false,
      	// 加密数据方法
      	encrypt: (data /* 待加密数据 */) => {
      		// 加密实现
      	},
      	decrypt: (secretData) => {
      		// 解密实现
      	}
      }

私有参数

import { defineStore } from 'pinia' 

interface PersistProps{
	// 持久化名称
	name?: string;
	// 需要进行单独持久化的 keys => state 中的 key 集合
	keys?: string[];
	// 持久化方式,localStorage 和 sessionStorage 
	// 或者自行实现,自行实现 Storage 时,注意要实现的方法
	storage?: Storage;
	// 是否使用加密进行存储
	useCrypt?: false;
	// 加密方法
	encrypt?: (data: string) => string;
	// 解密方法
	decrypt?: (secretData: string) => string;
}

const useStore = defineStore('default-store', {
	// 是否启用持久化,传入 true/[] 均可,表示使用公用参数进行持久化
	persist: boolean | PersistProps[]
	state,
	getters,
	actions
})

License

MIT License © 2022 Owner

pinia-persist-own's People

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.