在单页应用程序中，当在 VueJs 中输入新数据时，如何在不重新加载页面的情况下重新加载 api [关闭]

Posted 2023-02-23

【中文标题】在单页应用程序中，当在 VueJs 中输入新数据时，如何在不重新加载页面的情况下重新加载 api [关闭]

【英文标题】：In single page application how to reload api without reloading page when new data is entered in VueJs [closed]

【发布时间】：2020-01-04 16:47:11

【问题描述】：

我实际上已经为学校管理做了一个单页应用程序，其中有多个学生记录，当输入数据时，数据库中的数据会发生变化，但在我重新加载页面之前不会影响其他组件。 我已经使用 API 从数据库中获取数据。如何在 VueJs 中解决这个问题。

【问题讨论】：

没有任何代码是不可能提供帮助的。请阅读***.com/help/minimal-reproducible-example 了解如何提出问题，以便这里的人们可以提供帮助。

简单来说就是axios的代码。 axios.get("/student/" + this.sectionId).then(result => this.studentData = result.data.data; console.log(this.studentData); );

我问是否有任何方法可以在不重新加载的情况下将更改带入数据库。

【参考方案1】：

假设您在dataStudent:[] 上有学生数据，现在您在来自dataStudent:[] 的同一张表上输入了一个新数据，当您将数据输入到数据库subbpouse 时，您在formValue: 上有数据，这是对象和所有数据从formValue添加到数据库现在成功添加后，您必须将这些数据推送到数组中， 喜欢：dataStudent.push(formValue);

【讨论】：

这些推送的值是否可以从 vuejs 中的其他组件访问，同时获取 api 并在其他组件中以相同的表单值更改再次被推送到另一个组件。

是的，正确使用 $emit 和 $on，它是被动的，所以它会发生。

我使用 eventBus 来发出和 on 。可以吗？但这仅适用于某些事件。我想在不发生任何事件的情况下获得更新的 api。有可能吗？

这里的事件是添加新数据，created() 在第一次加载和调用 api 时会提供帮助