vue 和 vuex：一切正常，只是想看看如何缩短代码。是否有某种观察者或缩短代码的最佳方法是什么？

Question

以下是关于我如何实施购物车的操作。不要真的试图了解发生了什么，要点是每个函数中的最后一行代码。这是

localStorage.setItem('cart', JSON.stringify(state.cart));

这些操作调用突变，其中会改变变量 cart，因此每次更改后我都会将新购物车保存在 localStorage 中。代码有效，但我不喜欢重复。有更好的方法吗？我想可能是 watcher 改变了一个状态变量？但是有人知道它是否存在吗？以及如何使用它？

export async function removeItemFromCart({state, getters, commit}, id){
  let ind  = getters.index(id);

  commit('removeFromCart', ind);
  localStorage.setItem('cart', JSON.stringify(state.cart)); //here
}

export async function setCnt({state, getters, commit, rootGetters}, { id, cnt }){
  let ind  = getters.index(id);

  if(state.cart[ind].cnt + cnt >= 1 && state.cart[ind].cnt + cnt <= rootGetters['watches/item'](id).cnt)
    commit('addCnt', { ind, cnt})
  localStorage.setItem('cart', JSON.stringify(state.cart)); //here
}

Answer 1

我认为最好的方法是创建另一个用于在本地存储中设置购物车的操作。

export async function removeItemFromCart({state, getters, commit}, id){
  let ind  = getters.index(id);

  commit('removeFromCart', ind);
  commit('setCart', state.cart);
}

export async function setCnt({state, getters, commit, rootGetters}, { id, cnt }){
  let ind  = getters.index(id);

  if(state.cart[ind].cnt + cnt >= 1 && state.cart[ind].cnt + cnt <= rootGetters['watches/item'](id).cnt)
    commit('addCnt', { ind, cnt})
  commit('setCart', state.cart);
}

export function setCart({commit}, cart) {
  localStorage.setItem('cart', JSON.stringify(cart));
}

vue 和 vuex：一切正常，只是想看看如何缩短代码。是否有某种观察者或缩短代码的最佳方法是什么？

vue and vuex: Evrything works, just want to see how shorten a code. Is there sort of watcher or what's the best way to shorten a code?

watch

vue.js

vuex