javascript - vue data transfer problem

Question

app.vue page

bPage

I want page b to trigger the custom event of app.vue,

But it says bus is not defined. I want to know how to introduce it?

Answer 1

bus is brought up and placed in a specific place.

1. Create bus.js

// bus.js
import Vue from 'vue';  
export default new Vue(); 

2. Statement

import Bus from 'bus';  

export default {
    created() {  
        Bus.$on('getData', target => {  
            console.log(target);  
        });  
    }  
}

3. Call

import Bus from 'bus';  

export default{
    methods: {  
       but(event) {  
           Bus.$emit('getData', event.target);   
       }  
    }  
}

Answer 2

Although this approach is not highly recommended, you can:

window.bus = new Vue();

You can’t access bus because bus is a local variable. . .

---

Added:

If you do not use the global event bus, you can use the plug-in method: vue-bus

In addition, if you want to share this data between multiple components, use Vuex

Answer 3

Just put it in the data
It’s not clear yet, look here