Javascript Vuex未更新状态

在Vuejs应用程序中，我使用Vuex在组件之间进行状态管理。在Vuex存储中，我有一个操作，从API获取一些数据（工作正常），然后将其填充到状态（通过变异）。接下来，我使用getter将更新的状态传递给组件

问题在于将数据从操作填充到状态时出现问题。在DOM中，我尝试通过computed属性或使用getter获取，但获取空字符串

Vuex商店

const getDefaultState = () => {
    return {
        clientDeposit: ''
    }
}


//state
const state = getDefaultState();


//getters
const getters = {
    getDeposit: (state) => state.clientDeposit
}

//actions
const actions = {
    fetchClients({ commit}) {

       const clientId ="23"
       axios.post('/api/motor/fetchClients', {
         ClientId: clientId,
        })
         .then((response)=> {
          
          //console.log(response);  //returns data

          const deposit = response.data;
          commit('setIpfDeposit', deposit);
        })
    }
}

//mutations 
const mutations = {
    setIpfDeposit: (state, value) => (state.clientDeposit = value)
}

export default {
    state,
    getters,
    actions,
    mutations
}

组件

<template>
  <div>
        <button onclick="fetchClients()">Fetch Clients</button> 
        Deposit (Via computed property) : {{ fetchDeposit }}     
        Deposit (from getter) : {{ getDeposit }}         
  </div>
</template>

<script>
import { mapGetters , mapActions } from "vuex";
import axios from "axios";

export default {
  name: "",
  data() {
    return {
    }
  },
  computed: {
    ...mapGetters([
        "getDeposit"
    ]),
    fetchDeposit(){
        return this.getDeposit
    },
  },
  methods:{
    ...mapActions([
        "fetchClients"
    ])
  }
};
</script>

<style scoped>

</style>

获取客户端
存款（通过计算属性）：{{fetchDeposit}
存款（来自getter）：{{getDeposit}
从“vuex”导入{MapGetter，mapActions}；
从“axios”导入axios；
导出默认值{
姓名：“，
数据（）{
返回{
}
},
计算：{
…地图绘制者([
“获取存款”
]),
提取存款（）{
把这张支票还我
},
},
方法：{
…映射操作([
“获取客户端”
])
}
};

您需要先获取数据。 从vuex导入mapActions

import {mapActions, mapGetters} from 'vuex';

在组件的methods对象中引入FetchClient方法

methods:{
 ... mapActions(['fetchClients']),
}

然后在组件创建的生命周期方法中调用fetchClients方法

created(){
 this.fetchClients();
}

---

@为了寻求帮助，我省略了获取客户端数据时单击的按钮。我已经编辑了我的问题。请看一看。实际上，主要问题是从操作填充vuex状态。因此，我可以通过Vuex Getters将数据传递到Dom尝试使存储中的fetchClients操作异步。要使fetchClients操作异步，只需在操作名称之前添加async一词，并在axios api调用之前等待，如下面的async fetchClients（{commit}）{await axios.post（）}