vue-global

Share root component's properties and methods as reactive globals among vue components. Inspired by vue-stash and changed a little.

Install

npm i -S vue-global

Plug into Vue

import Vue from 'vue'
import VueGlobal from 'vue-global'

Vue.use(VueGlobal)

Usage

Almost the same with vue-stash. Two differences:

• All properties and methods of the root component could be globally shared, rather than only $root.data.store：

new Vue({
    el: '#app',
    data: {
        user: {
            name: 'cody'
        }
    },
    computed: ...
    methods: ...
})

• Use global instead of store as option name in your child components:

export default {
    global: ['user'],

    global: {
        user: 'user'
    },

    global: {
        name: 'user.name'
    },

    global: {
        name() {
            return 'user.name';
        }
    },
    ...

Of course you can always use this.$root.user.name in any components, without the global option.

NOTE

When calling methods of the root component, this would be always the root, even if called from child components.