如何在 vuex action 中獲取到 vue 實例

問題:
在作運營開發工具的時候 我想要請求後臺服務器保存成功後 彈出一個彈框(餓了嗎 的 message 彈框), 因爲$message 是掛在 Vue原型鏈上的方法 (Vue.prototype.$message = Message;)。如下action.js 中的this不指向Vue,所以如下代碼會報錯。vue

//action.js 
    export const saveActivity = ({commit},params) => {
      return Fetch.post(`/activities`,params).then( data => {
        if(data.code===2000){
             this.$message('保存成功') ;  // 報錯!!!
        }
      })
    };

解決辦法:promise

export const saveActivity = ({commit},params) => {
  return Fetch.post(`/activities`,params).then( data => {
    return data
  })
};

因爲action 的處理函數返回的是 promise 對象,此處能夠在調用saveActivity 的組件中 .then() 方法中處理:服務器

methods:{
...mapActions([
      'saveActivity'
    ]),
this.saveActivity(params).then(data=>{
        if(data.data.code === 2000){
          this.$message({
            message: '保存成功',
            type: 'success',
            center:true
          })
        }
      })
}

綜上: 雖然沒有在 action 中獲取到 vue , 可是用了另外一種方法一樣實現了個人功能。 之後相似這種問題均可以像這樣解決。函數

相關文章
相關標籤/搜索