Let the parent component sub-assemblies refresh vuex

First, let the parent component sub-assemblies to be refreshed, let Grandpa component sub-assemblies to be refreshed with the best vuex

1.store has been introduced in the global, the state will now save up

const updateStore = {
    state: {
      confirm: false
    },
    mutations: {
      setStore: (state, updateStoreData) => {
        state.confirm = updateStoreData
      }
    }
  }
  
  export default updateStore

2. The sub-assembly done after the delete operation, directly to the state change, remember that it must interfaces oh it done

  deleteStocking(id) {
      const _this = this
      this.$confirm('删除此信息', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        warehouseApi.stocking.deleteStocking({ id }, res => {
          this.$message.success(res.msg)
          this.$store.commit('setStore', true)
          this.handlePageCurrentChange(1)
        })
      })
    },

3. computed inside to get the latest data, and the refresh state by calling the interface will change back

  computed: {
      submitStatus () {
        return this.$store.state.updateStore.confirm
      }
    },
   watch: {
      submitStatus (val) {
        if (val) {
          Promise.all([this.getWarehouseDetail(), this.getInventoryDetail()]).then(()=> {
            this.$store.commit('setStore', false)
          })
        }
      }
    },

Guess you like

Origin www.cnblogs.com/antyhouse/p/12169256.html