Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://npmjs.com/package/vue-expose-inject below:

vue-expose-inject - npm

Exposes a set of properties to all of a components descendants.

const vm = new Vue({
    mixins: [expose],
 
    data: () => ({
        bus: new Bus(),
    }),
 
    expose() {
        return {
            bus: this.bus,
        };
    },
});
 
const child = new Vue({
    parent: vm,
 
    computed: {
        ...inject(['bus']),
    },
});
 
child.bus; 

Spatie is a webdesign agency based in Antwerp, Belgium. You'll find an overview of all our open source projects on our website.

You're free to use this package (it's MIT-licensed), but if it makes it to your production environment we'd appreciate if you send us a postcard from your hometown, mentioning which of our package(s) you are using.

Our address is: Spatie, Samberstraat 69D, 2060 Antwerp, Belgium.

The best postcards will get published on the open source page on our website.

You can install the package via yarn:

yarn add vue-expose-inject

This package is based on React's context feature. Exposes and inject are useful for giving your components access to global-ish objects, like event busses or authentication data. Expose/inject can make your application harder to reason about, and depends on a certain hierarchy with your components, so use with care!

Child components can inject properties that are exposed by one of their ancestors. This goes beyond parent-child communitation, the distance between the parent and child, grandchild, etc. doesn't matter.

To get started, expose an object from a parent component by adding the expose mixin and an expose function, which returns the object:

 
import { expose } from 'vue-expose-inject';
 
export default {
    mixins: [expose],
 
    expose() {
        return {
            bus: new Bus(),
        };
    },
}

Vue instance properties can also be exposed by passing their names in an array:

export default {
    mixins: [expose],
 
    data: () => ({
        bus: new Bus(),
    }),
 
    expose: ['bus'],
}

Descendant components can then inject the property using the inject helper function, which uses the same syntax as Vuex's map helpers:

 
import { inject } from 'vue-expose-inject';
 
export default {
    parent: vm,
 
    computed: {
        ...inject(['bus']),
    },
}

If you try to inject a property that hasn't been exposed by an ancestor, an error gets thrown

Injected properties can be renamed by passing in an object instead of an array:

export default {
    
 
    computed: {
        ...inject({
            myBus: 'bus',
        }),
    },
}

If you're not using the spread operator, you can assign the properties:

export default {
    
    
    computed: Object.assign(inject(['bus']), {
        
    }),
}

Please see CHANGELOG for more information what has changed recently.

$ npm run test

Please see CONTRIBUTING for details.

If you discover any security related issues, please contact Sebastian De Deyne instead of using the issue tracker.

• Sebastian De Deyne
• All Contributors

Spatie is a webdesign agency based in Antwerp, Belgium. You'll find an overview of all our open source projects on our website.

The MIT License (MIT). Please see License File for more information.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4