vuex状态预取不起作用

时间:2018-05-03 06:46:24

标签: vue.js vuejs2 vuex

我正面临关于vuex的问题, 在我的vue组件中,我调度一个商店请求,然后在计算钩子中映射存储状态,第一次返回null,我认为它在存储状态之前开始映射。

这是代码index.vue文件代码,

export default {
  name: 'tab_3',
  data () {
    return {
      tableData: []
    }
  },
  beforeCreate () {
    this.$store.dispatch('registerWeb3')
    this.$store.dispatch('getContractInstance')
  },
  computed: mapState({
    coinbase: state => state.web3.coinbase,
    balance: state => state.web3.balance
  }),
  methods: {
    Func: function () {
      console.log(this.coinbase)
      console.log(this.balance)
    }
  },
  beforeMounte () {
    this.Func()
  },
  updated () {
  }
}

以下是store.js文件代码:

Vue.use(Vuex)
export const store = new Vuex.Store({
  strict: true,
  state,
  mutations: {
    registerWeb3Instance (state, payload) {
      let result = payload
      let web3Copy = state.web3
      web3Copy.coinbase = result.coinbase
      web3Copy.balance = parseInt(result.balance, 10)
    },
    registerContractInstance (state, payload) {
      state.MyContract = () => payload[0]
      state.TokenContract = () => payload[1]
    }
  },
  actions: {
    registerWeb3 ({commit}) {
      getWeb3.then(result => {
        commit('registerWeb3Instance', result)
      }).catch(e => {
        console.log('error in action registerWeb3', e)
      })
    },
    getContractInstance ({commit}) {
      getContract.then(result => {
        commit('registerContractInstance', result)
      }).catch(e => console.log(e))
    }
  }
})

0 个答案:

没有答案