Pinia的Store的ID是全局唯一的标识符,但是在实际应用当中,我可能需要复用这一个State,举一个例子:我们现在有一个用户详情页,它下面有多个Tab页,那么我就定一个Store去在组件之间去共享数据,如果只能够开一个用户的详情页,那也就罢了,但是,假如我现在需要多开用户详情页,那么就不好玩了,在这个时候,我需要id可变,就像这样的:user-detail-{userId}.
import { defineStore } from'pinia'; interfaceCounterState { counter: number; } exportconstuseCounterStore=function(id: string) { returndefineStore(id, { state: (): CounterState=> ({ counter: 0, }), getters: { getCounter(): number { returnthis.counter; } }, actions: { increment() { this.counter++ }, randomizeCounter(){ this.counter=Math.round(100*Math.random()) }, }, })(); }
使用:
import { useCounterStore } from'@/stores/test'; conststore=useCounterStore("main-1") console.log('before', store.getCounter); store.randomizeCounter(); console.log('after', store.getCounter);
