vuex调用接口

1、安装vue、vuex在main.js中引入

  import Vue from 'vue'
  import store from './vuex'
  import server from './server'
2、server中文件adapter.js
  
  import Axios from "axios";
  getServerList() {
      class Processor { constructor(result) { return result } }; return new Promise((resolve, reject) => {
      const prm = this.request("/getServerList.json")
      prm.then((result) => {
        resolve(new Processor(result))
      })
      prm.catch((result) => {
        reject(new Processor(result))
      })
    })
  }
3、vuex中文件app.store.js
  
  import adapter from '../server/adapter.js'
  export default {
    state: {
      serverList:null,
     }
    mutations: {     
      serverList(state, param) {
        state.serverList = param
      },
    }    
 
    actions: {     
      reServerList(context) {   
        const prm = adapter.getServerList()
        prm.then(
          (result) => {
            context.commit('serverList', result.getBody())
          }
        )
        prm.catch(
          (result) => {
            context.commit('serverList', result.getBody())
          }
        )
      },
    }
  getters: {     
    serverList(state) {
        class ServerList {
          constructor(param) {
          this.serverList = param
          }
         }
        return new ServerList(state.serverList)
       },
  }
}

猜你喜欢

转载自www.cnblogs.com/lingshan168/p/9283542.html