问题标签 [vue-events]

我已经制作了一个组件（是不是矫枉过正？）以递归方式调用以呈现树，但似乎无法处理单击事件，因为在组件内呈现的内容无法在Vue's中看到我想要的方法methods; 这似乎是关于组件和事件的一些巨大的复杂性。

如何处理这些点击事件？真的有必要这么难吗？

我的视图，其中 filterItems 用于搜索功能。{{ item.arrival }}时间为 12:00 PM 、 1:00 PM 和 1:30 PM{{ post.customerName }}的名称为 David 、 Marco 和 Mario。这是我的视图代码

filterItems(post) 的示例数组

帖子：数组[3]

0：对象（名称：'David'，childName：'David Jr'，到达时间：'12:00 PM'）

1：对象（名称：'Marco'，childName：'Marco Jr'，到达时间：'1:00 PM'）

2：对象（名称：'Mario'，childName：'Mario Jr'，到达时间：'1:30 PM'）

如果客户单击 David Name，我如何在 David Name 下方显示 David Jr 的子名。如果他们点击 Marco 的名字，那么它应该在 MARCO 的名字下方显示 MARCO CHILD NAME。

现在，当我单击 David name 时，它​​也会显示 Marco 和 Mario 的子名。

在 Vue 应用程序中，我在 a 上粘贴listener，textarea目的是在用户将数据粘贴到此字段时运行验证代码。当我记录粘贴事件时，我可以在控制台中看到粘贴到字段中的数据在event -> target -> value. 不过，我似乎无法访问它event.target.value。我究竟做错了什么？

最小的例子：

https://jsfiddle.net/feg8pcmv/

所以我有一个评论框组件，它使用递归在嵌套的父子层次结构中列出用户评论（评论）。

假设传递给这个子组件的数据是

然后在子组件本身中，我们有如下代码结构：

布局效果很好，没有问题，但是当我尝试从子级向父级发出事件时会出现问题。

它在父组件中工作，我可以成功地为直系子级获取事件......

问题出在我单击子组件时，因为它是重复出现的组件，人们会期望它的行为方式相同，但事实并非如此。该事件不会与父组件产生共鸣。

在 vue 中如何处理这种边缘情况？

每当用户单击我的 vue 页面中的表格单元格时，我想打开一个自定义上下文菜单。所以我正在尝试使用此处row-contextmenu定义的事件，但它不会触发。

模板中的表格：

Vue方法：

当我左键单击表格中的任何行时，标准row-clicked事件工作正常并被触发。row-dblclicked也可以正常工作。但是，row-contextmenu即使我使用@row-contextmenu.prevent（Chrome 和 Firefox），该事件甚至都不会被触发，并且会出现标准的浏览器上下文菜单。两种浏览器的控制台都没有错误。

bootstrap-vue和 jsfiddles上的示例在两种浏览器中都可以正常工作。所以这似乎是一个本地问题？

谢谢你的帮助 ：）

我vue-draggable用来拖动我的项目。我正在尝试使用:move="onDrop"事件打印出移动的 id，它console.log(this.teamByTime2[0].id);仅使用第一个值打印出来。让我们从我的DATA中举个例子，有人叫KIM CHAN，如果我拖动 Kim，那么它假设打印“5”而不是“4”。有没有办法解决这个问题？

看法

方法

数据

这是我下面的代码CODE SANDBOX

https://codesandbox.io/s/serene-wildflower-sh4sk?file=/src/App.vue:874-1476

我有一个组件 ( Foo)，其中一个数据道具是处理大量非 UI 内容的类的实例 ( Bar)。Bar 中会有一些事件需要触发 Foo 中的行为。我想以尽可能尊重 Vue 数据流模型的方式将它们连接起来。推荐的方法是什么？我天真的解决方案是在 Bar 中有一些方法来设置事件处理程序，例如。在mounted我做this.bar.onMyEvent(this.onBarEvent)。这是我所希望的最好的，还是有更多的 Vuey 方法来做到这一点？

我正在尝试设置一个 vue 事件总线来在我的组件之间发送事件，我在我的app.js文件中有这个，Vue.prototype.$eventBus = new Vue();然后在一个组件中我有这个

在不同的组件中，在安装的方法中，我有这个，

该事件已成功发出，我可以在 vue 开发工具中看到，但它没有被第二个组件捕获，我正在使用 vue 路由器，所以我不确定这是否会影响它。

我尝试过使用两者this.$route.$on，this.$eventBus.$on但似乎都没有记录任何内容

我有一个具有类似功能的父组件（简化示例）

isValid(value) { return value > validationModifier }

父级和子级都使用该函数有条件地呈现例如 CSS 类。所以在我的孩子中，我想使用：

:class="{'my-class' : isValid(myValue)}"

但我无权访问此功能。我想避免在孩子身上重复它，而且我看不出在这种情况下发出事件是如何工作的。处理这个问题的适当方法是什么？

听众对@drop我不起作用。它没有调用我告诉它调用的方法。

我想拖动芯片并能够将其拖放到另一个组件上，并执行一个功能，但是在放置芯片时，该dropLink方法没有执行，所以我假设@drop事件没有发出。

控制台上不会显示任何错误。

其余的事件运行良好，例如@dragstart.

这是我使用的组件的代码：

在项目中，我也使用 Nuxt 以防万一。