Vue.js 根据vuex api请求初始化Vue组件中的数据

从vuex存储中的异步api调用初始化Vue组件中数据的最简单方法是什么。组件在数据可用之前装载

考虑：

export default {
data () {
  return {
    loanAmount: 300000,
    thirtyFixedAPR: null,
    fifteenFixedAPR: null,
    fiveArmAPR: null
  }
},
methods: {
  fetchRates () {
    this.thirtyFixedAPR = this.$store.state.rates.thirtyFixed.apr
    this.fifteenFixedAPR = this.$store.state.rates.fifteenFixed.apr
    this.fiveArmAPR = this.$store.state.rates.fiveArm.apr
  }
},
mounted () {
  this.fetchRates()
}}

我想在vuex存储中的api调用完成后调用fetchRates方法一次。我会使用computed属性，但我只想初始化数据，不想查看它。我已经尝试了一些使用观察器的变通方法，这些观察器看起来不是很优雅，我觉得有一个更简单的答案

---

谢谢你的帮助

您需要在Vuex中使用subscribe

基本上

const myMutationListener = this.$store.subscribe((mutation, state) => {
  if (mutation.type === 'MY_MUTATION_INSIDE_VUEX'){
   this.parameter1 = mutation.payload.parameter1
   this.parameter2 = mutation.payload.parameter2
  }
})

---

您是否尝试过用“created”方法而不是mount（）进行此操作？是的。生活方式挂钩的组合似乎不起作用。如果您设置延迟，那么inside mounted（）会让组件在调用vuex获取数据之前等待几秒钟吗？这可能是最简单的解决方案，我只是尽量避免延迟。是的，我同意。让所有这些属性由1个函数返回，该函数返回一个承诺，然后给承诺一个回调，并在网络调用完成时提取数据。