New instance (reuse) of module

[elceka]

Hi, please, how i can make a new instance of module? So, i need use same module in multiple namespaces, but with different state of that module. Thank you.

[christianmalek]

I didn't consider this functionality. But it should work like this if you are using version 1 of vuex-rest-api:

import { createStore, Resource } from "vuex-rest-api"

const resource = new Resource("https://jsonplaceholder.typicode.com")
  .addAction({
    action: 'listPosts',
    method: 'get',
    property: "posts",
    pathFn: () => `/posts`
  })
  .addAction({
    action: 'getPost',
    method: 'get',
    property: "posts",
    pathFn: ({ id }) => `/posts/${id}`
  })

const moduleA = createStore(resource)
const moduleB = createStore(resource)

const store = new Vuex.Store({
  modules: {
    a: moduleA,
    b: moduleB
  }
})

[elceka]

Thank you for reply. Now i use v2, but conceptually, with minor changes can this work, maybe. Thank you.

[christianmalek]

Version 2 should work like the following:

import Vapi from "vuex-rest-api"

const resource = new Vapi({
  baseURL: "https://jsonplaceholder.typicode.com",
    state: {
      posts: []
    }
  })
  .get({
    action: "getPost",
    property: "post",
    path: ({ id }) => `/posts/${id}`
  })

const moduleA = resource.createStore()
const moduleB = resource.createStore()

const store = new Vuex.Store({
  modules: {
    a: moduleA,
    b: moduleB
  }
})

[elceka]

Thank you, it's working.

Little correction of your example:

const moduleA = resource.getStore()
const moduleB = resource.getStore()

[christianmalek]

I've just rethought the store creation method. It uses Object.assign to create only shallow copies. According to your state it's possible that they share references.

Please have a look at the following code snippet:

// state
{
  propertyA: 42, // will be copied
  propertyB: { // will be copied, but it still uses the same reference
    c: 2,
    d: "foo"
  }
}

propertyA will be copied by value, but propertyB will only be copied by reference. If propertyB changes one of it's properties, these changed will be applied to every state who reference this property. So that's probably not the behaviour you desire.

I'll update this module soon to only use deep clones for store creation.

[elceka]

So i've try it in my app and it is OK, i have a multiple instances of same Vuex model between Vuex namespaces. I've fill instance of model in one namespace and it is filled, other instance of the same model in another namespace has been empty.

[christianmalek]

See Module reuse in https://vuex.vuejs.org/en/modules.html.

[christianmalek]

@elceka: I've updated the module to v2.1. Now you can pass an options object to the getStore() method. Read getStore() for more details.