Vue3 3/Pinia:在每个组件中添加主存储: mainStore()还是提供/注入？

Question

将pinia存储添加到Vue3组件的默认方法是通过在每个Vue3组件中加载nameStore.js

import {nameStore} from "@stores/nameStore.js"
const nameStr = nameStore()

Vue3有自己的提供/注入。

哪一种方法更适合用于几乎所有主要部件的主品品商店？(但在小型组件中使用不多)

Answer 1

在功能上，您的两个选项之间没有区别，正如@Duannx已经指出的那样。这取决于偏好。

在使用provide/inject时，避免导入语句和函数调用，将样板简化为单行const nameStore = inject('nameStore')，缺点是提供/注入通常会带来的缺点：

• --它导致组件之间的紧密耦合，使得它们在其他上下文中的可重用性降低。但是，如果您将存储注入应用程序的根组件，这并不重要。
• 没有编译时安全性:如果没有正确地提供存储，inject调用将返回undefined，只有在运行时才能找到它。

IMO导入和调用商店钩子的“正常”方式没有类似的问题，所以我通常建议使用它，而不是提供/注入，这增加了(再次，IMO)不必要的复杂性。但正如我所说，归根结底，这是一个品味问题:)