Question

请在下面查看我的代码。我正在尝试将Async Await实现为vuex。一切正常，但我想在此之后调用另一个动作，所以我尝试异步等待但它不起作用。在控制台 console.log（“在所有这些”+ res之后） res变量显示未定义。

action.js

import { createUpload } from '../api/index'
export default {
    fetchImageUrl: async({ commit }, reader) => {
      let res = await createUpload({ commit }, reader);
      console.log("after all this" +res)
    }
}

API / index.js

import { feathersClient } from './apiClient'
const uploadService = feathersClient.service('uploads');
export const createUpload = ({commit}, reader) => {
  uploadService
    .create({uri: reader.result})
    .then(function(response){
        commit('setImageUrl', { url: response.imageurl })
        return true;
    });
}

mutations.js

export default {
    setImageUrl: (state,{ url } ) => {
      state.imageUrl = url
    }
}

LeftPanel.vue

const reader  = new FileReader();
export default {
  name: 'left-panel',
  data () {
    return {
      open: true
    }
  },
  methods: {
    uploadFile: function (event) {
      let store = this.$store;
      let file = event.target.files[0];
      reader.readAsDataURL(file);
      reader.onload = function(event) {
        return store.dispatch('fetchImageUrl',reader)
      };
    }
  },
  components: {
    'add-text': AddText
  },
}

Answer 1

在return之前添加uploadService.create语句。

index.js

export const createUpload = ({commit}, reader) => {
  return uploadService
    .create({uri: reader.result})
    ...
}

async await with vuex + feathers

1 个答案: