ecamp / hal-json-vuex

Use a HAL JSON API with a Vuex store.
MIT License
8 stars 3 forks source link

Direct Store Mutation #6

Open pmattmann opened 3 years ago

pmattmann commented 3 years ago

Mutate Store without any server-request. Allows optimistic updates on clientside

usu commented 3 years ago

Maybe at least for $post we could let hal-json-vuex handle this automatically.

Use case:

let materialItems = this.api.get().materialItems({ contentNodeId: this.contentNode.id })
let newItemData = { article: "Tent" }

materialItems.$postEager(newItemData)

// at this point, materialItems already contains the new item with a temporary uri (simple hash)
// including a flag, e.g. item._meta.isPersisted = false (or similary)

materialItems.items[materialItems.length-1]._meta.self // --> 5ffd3cb97f651a73502429df51c439cd
materialItems.items[materialItems.length-1]._meta.isPersisted // --> false
materialItems.items[materialItems.length-1]._meta.isSaving // --> true
materialItems.items[materialItems.length-1].article // --> Tent

If the network request comes back successfully, the item is updated with the correct uri (of course only in the list above). Otherwise, the temporary entity is removed from the store.

_Alternative: temporary key is only used internally and not exposed via _meta.self?_