javascript - redux 非同步中間件有什麼意義呢？

Question

當我想發送一個請求時，直接在fetch函數裡寫不就好了麼，為什麼要多一步中間件呢？

const mapDispatchToProps = ( dispatch )=>({

    fetchAndRenderArticle( articleName ){

        fetch(`http://localhost:3000/getFile?articleName=${articleName}`).then( res=> {
            return res.text();
        }).then( articleContent =>{
            dispatch({
                type:'fetchAndRenderArticle',         
                articleContent:articleContent
            });
        }).catch( err=>{
            console.log(err);
        });
    }
});

Answer 1

非同步中間件是用來寫非同步Action的。

其實你的問題更像為什麼要用非同步Action，要求封裝成Action是為什麼？

Action統一管理觸發，reducer統一管理接收，並且更改狀態。這只是一種設計模式，降低程式碼耦合度。

於是，你的問題，請求需要封裝成非同步Action，而非同步Action依賴於非同步中間件。這就是為什麼需要redux非同步中間件了。