How can I pass data from component and use the data in a method?

Question

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:

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

Card Handler method Here's my card component

Answer 1

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.

import Vue from 'vue';

export const EventBus = new Vue();

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.

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, …).