This package has been deprecated

Author message:

Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

---

vue-unstated

A tiny state management library for Vue Composition API based on unstated-next which is for React.

🏇 Demo

🔌 Installation

$ npm install --save vue-unstated

or

$ yarn add vue-unstated

🏄 Usage

use/counter.js

import { reactive } from '@vue/composition-api' // Vue 2 with @vue/composition-api
import { reactive } from 'vue' // or Vue 3
import { createContainer } from 'vue-unstated'
 
const useCounter = (initialState = { count: 0 }) => {
  const state = reactive(initialState)
 
  const increment = () => {
    state.count++
  }
 
  return { state, increment }
}
 
export const counterContainer = createContainer(useCounter)

Parent.vue

<script>
import { counterContainer } from 'use/counter'
import Child from 'Child.vue'
 
export default {
  components: { Child },
  setup() {
    // You can share same state in its child nodes!!
    const { state, increment } = counterContainer.provide()
 
    return {
      count: state.count,
      increment,
    }
  }
}
</script>

Child.vue

<script>
import { counterContainer } from 'use/counter'
 
export default {
  setup() {
    // You can use same state with Parent.vue!!
    const { state, increment } = counterContainer.useContainer()
 
    return {
      count: state.count,
      increment,
    }
  }
}
</script>

🏁 LICENSE

MIT