如何从组件传递数据并在方法中使用数据? [英] How can I pass data from component and use the data in a method?

问题描述

我正在开发一个记忆游戏，如果它们不是一对，我正在尝试让卡片自动翻转回来.代码如下:

I'm working on a memory game and I'm trying to make the cards flip back automatically if they are not a pair. Here's the code:

我想将isFlipped"数据传递给我的 main.js.

I want to get the "isFlipped" data to be passed over to my main.js.

卡片处理方法这是我的卡片组件

推荐答案

您可以做的一件事是使用 bus 或 eventBus.

One of the things you can do is use bus or eventBus.

您需要做的第一件事是创建事件总线并将其导出到某处，以便其他模块和组件可以使用它.

The first thing you’ll need to do is create the event bus and export it somewhere so other modules and components can use it.

从'vue'导入Vue;

import Vue from 'vue';

导出const EventBus = new Vue();

export const EventBus = new Vue();

您需要做的是导入 Vue 库并导出它的一个实例.(在本例中，我将其称为 EventBus.)您实际上获得的是一个与 DOM 或应用程序的其余部分完全分离的组件.它上面存在的只是它的实例方法，所以它非常轻量级.

ll you need to do is import the Vue library and export an instance of it. (In this case, I’ve called it EventBus.) What you’re essentially getting is a component that’s entirely decoupled from the DOM or the rest of your app. All that exists on it are its instance methods, so it’s pretty lightweight.

假设您有一个非常激动人心的组件，当有人点击它时，它需要通知您的整个应用它被点击了多少次.以下是您将如何使用 EventBus.emit(channel: string, payload1: any, ...) 来实现它.

Say you have a really excited component that feels the need to notify your entire app of how many times it has been clicked whenever someone clicks on it. Here’s how you would go about implementing that using EventBus.emit(channel: string, payload1: any, …).

这篇关于如何从组件传递数据并在方法中使用数据?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！