Gestion d'état partagée entre les composants et l'API de composition Vue

import { ref, computed } from 'nuxt-composition-api'

const state = ref(false)

export default function useColoration() {
  const toggle = () => (state.value = !state.value)

  return {
    state: computed(() => state.value),
    toggle
  }
}

Un état partagé globalement entre les composants peut être obtenu en gardant la variable state en dehors de la fonction exportée et en renvoyant les propriétés computed.

import useColoration from '~/use/coloration'

export default {
  setup() {
    const { state: colorationState, toggle: colorationToggle } = useColoration()
    return { colorationState, colorationToggle }
  }
}

Vue Composition API
Nuxt Composition API