Vue composition API store

0
votes

I was wondering if it was possible with the new Vue composition API to store all the ref() in one big object and use that instead of a vuex store. It would certainly take away the need for mutations, actions, ... and probably be faster too.

So in short, is it possible to have one place for storing reactive properties that will share the same state between different components?

I know it's possible to have reusable code or functions that can be shared between different components. But they always instantiate a new object I believe. It would be great if they would depend on one single source of truth for a specific object. Maybe I'm mixing things up...

1
vue.jsvue-componentvuex
I don't see why that won't work, but the need for mutations and actions will not go away. Mutations/Actions are gatekeepers, but they are more important from a data flow point of view. A mutation/action can do validation and parsing. This need doesn't go away by using composition API. - Radu Diță
Here is a guide that I used. Basically you just create a ref variable outside of your exported function. vueschool.io/articles/vuejs-tutorials/… - LeeR

1 Answers

0
votes

You can use reactive instead of ref.

For eg.

  • You can use
    export const rctStore = reactive({
      loading: false,
      list: [],
      messages: []
    })
  • Instead of
    export const loading = ref(false)
    export const list = ref([])
    export const messages = ref([])

Cheers!