3.1.2 • Published 7 days ago
@xstate/vue v3.1.2
@xstate/vue
This package contains utilities for using XState with Vue.
:warning: Vue 2 Notice:
If you're using Vue 2.x, please see the Vue recipe instead, or use the xstate-vue2
package if you want to use the Vue Composition API.
Quick start
- Install
xstate
and@xstate/vue
:
npm i xstate @xstate/vue
Via CDN
<script src="https://unpkg.com/@xstate/vue/dist/xstate-vue.min.js"></script>
By using the global variable XStateVue
- Import the
useMachine
composition function:
<script setup>
import { useMachine } from '@xstate/vue';
import { createMachine } from 'xstate';
const toggleMachine = createMachine({
id: 'toggle',
initial: 'inactive',
states: {
inactive: {
on: { TOGGLE: 'active' }
},
active: {
on: { TOGGLE: 'inactive' }
}
}
});
const { snapshot, send } = useMachine(toggleMachine);
</script>
<template>
<button @click="send({ type: 'TOGGLE' })">
{{
snapshot.value === 'inactive'
? 'Click to activate'
: 'Active! Click to deactivate'
}}
</button>
</template>
3.1.2
7 days ago
3.1.1
2 months ago
3.1.0
2 months ago
3.0.3
4 months ago
3.0.2
4 months ago
3.0.1
4 months ago
3.0.0
5 months ago
3.0.0-beta.5
7 months ago
3.0.0-beta.4
10 months ago
3.0.0-beta.6
5 months ago
3.0.0-beta.3
11 months ago
3.0.0-beta.2
1 year ago
3.0.0-alpha.1
1 year ago
3.0.0-alpha.0
2 years ago
2.0.0
2 years ago
1.0.0
2 years ago
0.8.2
2 years ago
0.8.1
3 years ago
0.8.0
3 years ago
0.7.0
3 years ago
0.6.0
3 years ago
0.5.0
3 years ago
0.4.0
3 years ago
0.3.0
4 years ago
0.2.0
4 years ago
0.1.1
4 years ago
0.1.0
4 years ago