javascript - Vuejs - 在同一组件中获取不同的日期

Question

我已经创建了几个组件(表、选择等)并且都使用相同的方法来获取 API 信息。

目的是在应用程序的不同页面上使用这些组件，因此无论接收到的信息如何，都可以使用相同的组件(例如表格)，我已经创建了许多方法来实现这一点。

但是，要将这些方法应用于所有请求 API 的组件，您将不得不重复大量代码，因此我们的目标是在全局范围内创建这些方法。

经过搜索，我找到了三种方法，分别是 Plugins、Mixins 和 Vuex。但是我不知道最理想的方法是什么。

有什么建议吗？

Answer 1

选择Vuex .

创建一个集中式存储，您的组件在其中使用 getters、actions 和 mutations 与其数据进行交互，并且存储知道如何与其进行交互API。

例如，您的 table 组件可以是哑，并且只需要一个 :data=someData 来初始化 >table 传递给它，然后它只呈现传递的内容。此 someData 可以映射到父组件中的 Vuex getter(或直接映射到存储状态中的项目)。

当您的组件需要将某些内容提交给 API 时，它可以触发一个事件，父级将拾取该事件并在商店中调用适当的 action 或 mutation，商店将知道在 API 中调用什么来执行此操作。因此，即使您的 parent 也不完全了解 API 的工作原理，只是您对 if 的抽象，由您的 Vuex 存储表示。

我创建了一个非常simple todos application上周在这里的另一个问题，随意看看，使用Vue，Vuex并将数据保存到Firebase .它也没有尽可能地实现 REST，但是更改存储以使用正确的 REST 方法并不难get、post、put , 删除等

这个应用程序的所有相关代码都在App.vue和store.js中，其中一行在main.js中将商店添加到 Vue 实例。