Kylin

一.组件关联store (connect中间件,封装在依赖中,用component引用)

import { Component } from '@ali/kylin-framework';   
@Component({
    mapStateToProps: {
      color: s => s.config.backgroundColor,
      name: s => s.config.displayName,
      userId: s => s.userId,
      energy: s => s.energy
    },
    mapActionsToMethods: ['queryEnergy']
  })

 

在组件内调用  this.queryEnergy()  触发store定义的  action函数

二. action:

actions: {
    async queryEnergy({ commit }) {
      let sum;
      try {
        const data = await queryEnergyImpl();
        sum = data.userEnergy && data.userEnergy.energySummation;
        commit('updateEnergy', sum);
      } catch (ex) {
      }

      return sum;
    }
  }

action用commit触发mutations中定义的函数,改变state

三, mutations:

 mutations: {
    updateEnergy(state, payload) {
      state.energy = payload;
    }
}

 

你可能感兴趣的:(Kylin)