Vue.js Vuex - 在数据库中删除未反映在视图中

我在Vuex商店中有许多公司。每个公司对象都有几个对象...为了简化我的问题，想象一下Vue.js Vuex - 在数据库中删除未反映在视图中

company {id：1，approval_notes：[{id：1}，{id：2}，{id：3} ]，鳍： {total_rev：10000}}

我想从公司的1

的ID在视图中移除与2的id approval_note，我有

deleteNote(obj) { 
       if(confirm('Are you sure you want to delete this note?')) { 
        let path = '/api/approval_notes/' + obj.id; 
        axios.delete(path) 
         .then(function(rsp) { 
          this.$store.dispatch('delete_approval_note', obj); 
         }.bind(this)) 
         .catch(function (err) { 
          console.log('AXIOS ERR', err); 
         }.bind(this)); 
       } 
      }

行动是

export const delete_approval_note = ({commit}, payload) => { 
    commit('DELETE_APPROVAL_NOTE', payload); 
};

，变异是

export const DELETE_APPROVAL_NOTE = (state, payload) => { 
    _.each(state.companies, function(co) { 
     if(co.id = payload.company_id) { 
      let notes = co.approval_notes; 
      notes.splice(notes.indexOf(payload), 1); 
     } 
    }); 
};

的音符从数据库中删除，但视图不无刷新页面更新。

这种类型的事情我会做一堆，所以了解这个过程是很重要的，因为我明显地不知道现在。

任何帮助表示赞赏。

来源

2017-02-22 jgravois

它实际上从笔记中删除它？ – Saurabh

不在“实时”中......它从数据库中删除并刷新页面，我正在重新获取笔记，因此它不再显示。点击时我需要删除它。 – jgravois

相反的IndexOf，采用

notes.findIndex(obj => obj.id == payload.id)

它可以使用的IndexOf复杂的对象时变得棘手，我主要依靠的indexOf如果处理简单的值（整数，字符串，布尔值）

来源

2017-06-28 12:29:35

Vue.js Vuex - 在数据库中删除未反映在视图中

回答

相关问题