我在同一个父组件上有一个组件的两个实例，这个子组件在创建的生命周期挂钩中进行 API 调用以填充下拉列表。对于孩子的两个实例，列表数据将是相同的。
所以结果是，当我的父组件加载时，我实际上调用了两次 API，这是不必要的。
我的问题是，如果我只想调用一次 API，我应该将 API 调用移至父级并将下拉列表项传递给子级，还是使用 vuex 并让父级调用调用 API 的操作.然后该操作会将项目保存到 state 中，子组件将通过 store getter 访问项目。
我很想使用 vuex 存储，因为列表很小，并且可能在当前父级之外的其他地方需要。
【问题讨论】：
TLDR;
如果你想在 Parent-> child 关系之外使用它，请使用 Vuex
如果您知道它既简单又小巧，那么将其作为道具传递也同样有效，并且可以降低设置商店的复杂性。
另一种选择是将其存储在 localStorage 中，但这可能不如您想要的可靠，因为清除缓存的人将失去下拉菜单的功能。
您可以将其存储在 Vuex 存储中，使其可以在应用程序中的任何位置持续存在，但是，如果父级获取列表并且只需将下拉列表传递给子级，您也可以创建一个支持孩子并以这种方式传递下拉列表。
Children 可以访问下拉列表项，而您不需要为小应用程序中的简单下拉列表添加 Vuex 的复杂性？
您提到列表不是很大，如果下拉列表不是用户每次都需要单击或使用的内容，那么将其作为两个 API 调用并不一定是坏事。您可以在他们尝试访问下拉列表时加载数据，这在某些情况下可以节省您和客户在不需要时请求下拉列表的带宽。
【讨论】：
如果您需要将相同的数据呈现给多个组件，您应该选择 Vuex 商店。 Vuex 存储在初始设置级别增加了代码复杂性，但之后将 API 数据用于多个组件是如此简单和轻松。这并不意味着在每个应用程序中都使用 Vuex 存储。如果您正在开发本质上是渐进式的应用程序并且将来会变得更加复杂，那么请开始使用 Vuex 商店。它将帮助您在未来的发展中。这是所有Vuex store 的详细信息。
【讨论】：