如何在成功或錯誤後使用redux thunk重定向？

Question

我是Promises和React的新手。我在我的動作創作者中使用了redux-thunk來解決承諾，我從組件中調用動作創建者。請求完成成功或失敗後，如何路由到其他網址？我附加了刪除函數動作創建者的代碼。

我應該在分派成功時用參數（routeTo）設置狀態嗎？

這裏的刪除功能：

export function deletePost(id){ 
    var request = axios.delete(`${ROOT_URL}posts/${id}${API_KEY}`); 

    return function(dispatch){ 
     request.then((response)=>{ 
      console.log("I deleted"+response.data.title); 
     }).catch((error)=>{ 
      console.log("DELETE_ERROR: "+JSON.stringify(error)); 
     }); 
    } 
} 

我打電話在我的組件一個onclick功能這一功能。

deletePost(){ 
    this.props.deletePost(this.props.params.id); 
} 

Answer 1

我發現使用redux進行路由的最佳方式是考慮我的狀態的URI部分，並將其存儲在redux中。有一個優秀的圖書館react-router-redux將爲您做到這一點。

一旦你有反應，路由器終極版的設置，那麼你可以派遣行動來改變位置，所以您的thunk看起來像：

import { push } from 'react-router-redux'; 

export function deletePost(id){ 
    var request = axios.delete(`${ROOT_URL}posts/${id}${API_KEY}`); 

    return function(dispatch){ 
     request.then((response)=>{ 
      console.log("I deleted"+response.data.title); 
      dispatch(push('/delete-success-uri')); 
     }).catch((error)=>{ 
      console.log("DELETE_ERROR: "+JSON.stringify(error)); 
      dispatch(push('/delete-fail-uri')); 
     }); 
    } 
}