How to get data from vue component in another component?

Question

Vue.js

There is vue royter

.....
const Edit = Vue.component('edit', require('./components/pages/edit.vue'));
const Product_category = Vue.component('home', require('./components/pages/product_categories.vue'));

const routes = [
    ........
    {
        path: '/product_categories',
        name: 'product_categories',
        component: Product_category
    },
    {
        path: '/product_categories/edit/:id',
        name: 'product_categories_edit',
        components: {default: Edit, entity: Product_category},
        props: {default: true, entity: true}
    }
];

How can I get the data of the Product_category component in the Edit component?

<script>
    export default {
        props: ['id', 'entity'],
        mounted: function () {
            console.log('Admin edit page mounted.');
            console.log(this.entity); // Eror
            console.log(entity); // Eror
            this.getData();
        },
    }
</script>

Direct appeal is not suitable, because. each route will have its own entity.

Answer 1

use store to store data, very convenient!