2017-09-14 159 views
0

請檢查下面我的代碼。我試圖在vuex中實現異步等待。一切正常,但我想在此之後調用另一個動作,所以我嘗試與異步等待但它不工作。在控制檯console.log(「畢竟這個」+ res) res變量顯示未定義。asue等待與vuex +羽毛

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 
    }, 
} 

回答

3

uploadService.create之前添加return聲明。

index.js

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

感謝@alexmac,它的工作。你能解釋一下嗎? – Rahul

+0

'createUpload'調用'uploadService'函數,但是如果您不返回此調用的結果,它會立即結束。 – alexmac