Skip to content
A ContextAPI-like package for Vue.js modules and dependency injection
JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.babelrc
.gitignore
.npmignore
LICENSE
README.md
package.json
webpack.config.js
yarn.lock

README.md

Convext

A ContextAPI-like package for Vue.js modules and dependency injection

This package creates mixins for dependency injection in Vue js components. Other ContextAPI attempt to mimic the original functionality. This module attempts to leverage the Provide/Inject api of Vue and creates Mixins so you can quickly add reactive data to your Vue app.

To use Convext you only need to import it:

// name-convext.js
import Convext from 'convext'

export default Convext('name',{defaultValue:'Sally'});

Then to add the reactive properties you can simply add it to your components.

<!-- get-name.vue -->
<template>
  <div>
    <label for="name">Name</label>
    <input type="text" id="name" v-model="name">
    <name-display />
  </div>
</template>
<script>
  import NameConvext from "./name-convext"
  import NameDisplay from "./name-display"
  export default {
    // since this is Parent we want to Provide the data.
    mixins:[NameConvext.provideMixin()],
    components:{NameDisplay}
  }
</script>
<!-- name-display.vue -->
<template>
  <p>Hi, my name is {{ name }}</p>
</template>
<script>
  import NameConvext from "./name-convext.js"
  export default {
    // since this is a child component we want to inject the data.
    mixins:[NameConvext.injectMixin()]
  }
</script>
You can’t perform that action at this time.