这是一个基于观点的问题，但我认为每个开始使用Pinia和Vue的人都会问。不会有正确的答案。我只是想分享我认为Vue项目的好结构。
我总是把我的应用程序分成tiers。每一层都通过一个接口与另一层通信，因此我们可以轻松地在库/API之间切换，而无需更新其他层中的任何代码。

---------------          --------------------          ---------------
   |     View    |          | State management |          |     API     |
   | ~~~~~~~~~~~ | <----->  | ~~~~~~~~~~~~~~~~ | <----->  | ~~~~~~~~~~~ |
   | .vue,       |          |   Pinia / Vuex   |          | axios/fetch |
   | composables |          |                  |          |             |
   |_____________|          |__________________|          |_____________|

你可能听说过MVC设计模式，所以这个模式有点像它。我们有3层View、State management和API。View层从State Management层获取数据。如果数据存在，State Management层将返回它。如果数据不存在，则State Management调用API来检索它
每一层都通过一个接口与另一层通信，在我们的例子中，它只是一个函数。Let表示您想构建一个产品页面，因此您想通过其句柄获取产品。现在，在State management层中，您可以定义如下操作

// productStore.ts
getProductByHandle(handle: string) : Product {
 return API.getProductByHandle(handle)
}

在API层中，您可以定义如下函数：

// productAPI.ts
getProductByHandle(handle: string) : Product {
 return fetch('product-api-endpoint')
}

因此，无论你使用什么库，你都必须保持这些函数的形状不变。这里的形状是输入（handle）和输出（Product）。如果可以做到这一点，您可以在Pinia/Vuex、axios/fetch或任何您想要的代码之间切换，而无需修改其他层代码