Javascript 如何从子组件的操作强制重新加载父组件

请检查我提供的链接，我想在通过API向表中添加项目时刷新表，在删除项目时刷新表

将数据添加到表中的按钮位于子元素中，但显示数据的表位于父组件中，因此我不确定如何单击子元素中的按钮以强制父组件重新加载/刷新

---

（若要添加项目，必须先勾选“我的UI”中的单选按钮）

您不需要强制重新加载表格，Vue是被动的，这意味着当您更新模型时，视图会自动更新

Vue最显著的特点之一是不引人注目的反应系统。模型只是普通的JavaScript对象。修改它们时，视图将更新。它使状态管理变得简单直观，但了解其工作原理以避免一些常见问题也很重要

例如，如果您希望在删除趋势时更新表，则应该从模型中删除该趋势，您当前只是发送一个api请求

---

您可以放置

this.toptrackTrends=this.toptrackTrends.filter（x=>x.ID！==deleteid）

在

DeleteTrend

方法的底部，这将过滤掉ID为deleteid的任何趋势。

您不需要强制重新加载表格，Vue是被动的，这意味着当您更新模型时，视图会自动更新

Vue最显著的特点之一是不引人注目的反应系统。模型只是普通的JavaScript对象。修改它们时，视图将更新。它使状态管理变得简单直观，但了解其工作原理以避免一些常见问题也很重要

例如，如果您希望在删除趋势时更新表，则应该从模型中删除该趋势，您当前只是发送一个api请求

---

您可以放置

this.toptrackTrends=this.toptrackTrends.filter（x=>x.ID！==deleteid）

在

DeleteTrend

方法的底部，这将过滤掉ID为deleteid的任何趋势。

您可以使用$emit向父元素发送通知

因此，当确认后，您可以发送$emit

this.$emit('weAreSure')

在父组件html中：

<HelloWorld msg="Hello Vue in CodeSandbox!" @weAreSure="handleweAreSure"/>

handleweAreSure只是一种vue方法，您可以在其中重新加载数据， 或者，您也可以向该方法添加一些参数

有关发射的详细信息，请参见

---

如果您必须在应用程序中使用大量$emit，可能值得查看vuex（）。

您可以使用$emit向父元素发送通知

因此，当确认后，您可以发送$emit

this.$emit('weAreSure')

在父组件html中：

<HelloWorld msg="Hello Vue in CodeSandbox!" @weAreSure="handleweAreSure"/>

handleweAreSure只是一种vue方法，您可以在其中重新加载数据， 或者，您也可以向该方法添加一些参数

有关发射的详细信息，请参见

---

如果您必须在应用程序中使用大量的$emit，可能值得查看vuex（）。

因此此方法删除（toptrackTrends）中已经存在的元素。当我给它添加新项目时怎么样？因为（toptrackTrends）获取新项目的唯一方法是再次调用API，对吗？使用当前设置，您可以执行@dreijntjens建议并订阅类似

的事件，然后在添加趋势

this时发出该事件。$emit（“addTrend”，newtrend）

因此此方法删除（toptrackTrends）中已存在的元素。当我给它添加新项目时怎么样？因为（toptrackTrends）获取新项目的唯一方法是再次调用API，对吗？使用当前设置，您可以执行@dreijntjens建议并订阅类似

的事件，然后在添加趋势

this时发出该事件。$emit（“addTrend”，newtrend）