近日做一个前端项目用的是vue3 ,状态管理用的是pinia,在 保存数据,在同一窗口打开新页面,数据读取正常,当用window.open(url)打开新页面时,读到的数据就不是新保存的数据,查了很多资料都没有解决。后来静下心来看pinia-plugin-persistedstate官方文档,才在文档中找到答案。
Forcing the persistence
In case you need to manually trigger persistence to storage, every store now exposes a $persist
method.
Given this store:
ts
import { defineStore } from 'pinia'
const useStore = defineStore('store', {
state: () => ({
someData: 'Hello Pinia'
})
})
You can call $persist
:
ts
const store = useStore()
store.$persist()
如上所示,store.$persist()可以强制持久化,保存state,在原来的保存文句后面调用store.$persist(),强制保存后,用window.open(url)打开新页面时,在新页面读到的数据就是最新的数据了,可见pinia的持久化是有延迟的。
that.setArticle(article);
that.store.$persist();