pinia不共享状态(闭包思想)

问题背景

面试时，面试官问了我一个感觉比较有意思的问题，抽空来记录下。

具体问题

Pinia 是 Vue 的专属状态管理库，它允许你跨组件或页面共享状态。那如果想使用pinia实现单独的状态应该怎么做。

分析问题

这道题和vue中data的用法很像，因为data可以使用方法形式定义也可以使用对象形式，可以先分析下vue的data定义再来解决这个问题
先模仿组件构造函数，定义 data属性，采用对象的形式

function Component(){
 
}
Component.prototype.data = {
	count : 0
}

创建两个组件实例

const componentA = new Component()
const componentB = new Component()

修改 componentA组件 data属性的值，componentB中的值也发生了改变

console.log(componentB.data.count)  // 0
componentA.data.count = 1
console.log(componentB.data.count)  // 1

产生这样的原因这是两者共用了同一个内存地址，componentA修改的内容，同样对 componentB产生了影响
运用闭包思想的话就可以解决这个问题

function Component(){
	this.data = this.data()
}
Component.prototype.data = function (){
    return {
   		count : 0
    }
}

修改 componentA组件 data属性的值，componentB中的值不受影响

console.log(componentB.data.count)  // 0
componentA.data.count = 1
console.log(componentB.data.count)  // 0

解决问题

现在就很明显了，其实data之所以能做到各个使用的地方互不影响，是因为运用了闭包思想，pinia的那个问题也可以使用闭包思想解决