【问题标题】:Pass Click Event to two components up Vuejs将 Click 事件传递给 Vuejs 上的两个组件
【发布时间】:2022-09-30 23:28:49
【问题描述】:

如何将单击事件从一个组件传递给两个父级。 我有一个底部清晰的表单,这个表单组件在文件 filterForm 中 filterform 组件在另一个名为 TableView 的文件中调用,而 tableView 组件在一个名为 Admin 的文件中调用 单击清除按钮时,我想在管理员内部执行一个功能

该按钮在文件 filterForm 中

在 TableView 中使用 filterForm

并且 tableView 在 Admin 中使用

这是我想从管理员调用来测试的函数

我知道我必须从 fileForm 制作一个单击事件并将该事件发送到 Tableview,但该函数位于包含所有数据和方法的 Admin 上。

谢谢你的帮助!

  • 将共享状态移动到 vuex store 可能会对您有所帮助,以便您可以对来自任何组件的数据进行操作。没有更清洁的方法,更简单的选择可能是在每一层上捕获并发出相同的事件。我猜无论哪个漂浮你的船。

标签: vue.js vuejs2 vue-component vuetify.js vuejs3


【解决方案1】:

基于 Vue.js 中的 $emit 事件:https://vuejs.org/guide/components/events.html

当您发出这样的事件时:$emit('someEvent'),父 someEvent 函数将触发(您也可以传递一些参数)。

传递数据或发出函数以便两个父级监听您的事件并获取数据将需要一些链接。

在第一个组件上触发事件并在第二个组件中获取它,然后在第二个组件中触发事件以在第三个组件中获取它。

编辑:最佳实践之一是使用 Vuex(Pinia) 作为状态管理工具,以更简单、更清洁的方式传递或获取数据。

【讨论】:

    猜你喜欢
    • 2014-01-28
    • 1970-01-01
    • 2019-11-16
    • 1970-01-01
    • 2019-08-06
    • 2017-08-13
    • 2019-09-15
    • 2020-02-02
    • 2020-08-13
    相关资源
    最近更新 更多