Pinia 数据持久化储存（pinia-plugin-persistedstate）
发布时间：2024-10-02 14:01
pinia需要使用pinia-plugin-persistedstate插件来进行数据的存储
插件官网地址：
https://prazdevs.github.io/pinia-plugin-persistedstate/guide/config.html
1、安装
这里对插件的安装就不多赘述了，放两张官网的截图
使用命令：npm i pinia-plugin-persistedstate
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/edf5638b4be44e9f86e1fd994cadea4a.png\")
2、使用
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/3af9464f8e4f44358b0c7d2d17a0345f.png\")
3、关于全部缓存及部分缓存的说明
（1）将store的state中的全部数据进行缓存，直接在state同级下面添加persist对象
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/3ebb0866a9ce4677b29ce3ad0310546e.png\")
此时，默认将数据存放在浏览器的SessionStorage中，key为store的名称，value为该store中所有的数据。
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/a8f8f4ed14b54103902cbe16a11948c3.png\")
（2）将store的state中的数据进行部分缓存
此时需要在persist中添加strategies数组，
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/000b55c53a934bce890572046e15a742.png\")
每个元素的key是想要储存的数据变量名（在state中定义的），storage可以写sessionStorage或者localStorage，此时，sessionStorage中的key就是变量名，value就是该变量的值
![\"在这里插入图片描述\"](\"https://img-blog.csdnimg.cn/38d893a0fd7349ceabd66d753cbf9269.png\")
文章到这里就结束啦，希望能够帮助到大家！