子组件让父组件进行刷新vuex

Posted 2021-03-17 antyhouse

首先子组件让父组件进行刷新,子组件让爷爷组件进行刷新最好用vuex

1.store已经在全局引入了,现将状态存起来

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

2 .子组件做完删除操作后,直接将状态更改,记得一定要是接口调完哦

  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里面去拿到最新的数据,并且通过调接口刷新后将状态改回来

  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)
          })
        }
      }
    },