Shared State Management zwischen Komponenten und der Vue Kompositions-API

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
  }
}

Ein global geteilter Zustand zwischen Komponenten kann erreicht werden, indem die Variable state außerhalb der exportierten Funktion gehalten und computed properties zurückgegeben werden.

import useColoration from '~/use/coloration'

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

Vue Composition API
Nuxt Composition API