介绍
redux-publish-action 是一款可与 Redux 框架整合的 npm 包，它可以帮助你更方便地发布异步 action。本文将详细讲述如何使用 redux-publish-action 来提升开发效率。
安装
你可以通过以下命令来安装 redux-publish-action：
npm install redux-publish-action --save
配置
在 Redux 应用中使用 redux-publish-action 需要对其进行一些配置。在 store 中添加 middleware：
-- -------------------- ---- ------- ------ - ------------ --------------- - ---- -------- ------ ----- ---- -------------- ------ ----------------------- ---- ----------------------- ------ ----------- ---- ------------- ----- ----- - ------------ ------------ ---------------------- ------------------------ --
此外，你还需要在 reducer 中注入 publishActionReducer：
-- -------------------- ---- ------- ------ - --------------- - ---- -------- ------ - -------------------- - ---- ----------------------- ------ ----------- ---- ---------------- ----- ----------- - ----------------- ----- ------------ -------------- -------------------- -- -- -------------------- --- ------ ------- ------------
使用
调用
在使用 redux-publish-action 发布异步 action 时，你需要使用 dispatchPublishAction 方法。例如：
-- -------------------- ---- ------- ------ - --------------------- - ---- ----------------------- ------ - -------- - ---- -------------- ------ ----- ------- - ------ -- ----------------------- ----- --------- -------- ----- ---- ------------------------------ ------- ------ ---
在上面的示例代码中，我们使用 dispatchPublishAction 方法发送一个 POST 请求，将新的 Todo 保存到服务器，并 dispatch 一个 ADD_TODO 的 action。
监听
redux-publish-action 需要接收服务器响应并自动触发相应的 action，需要在 index.js 中监听：
-- -------------------- ---- -------
------ - --------------------- ----------------------- - ---- -----------------------
----- ------ - ---------------- -------- -- -
----- ---- - ----------------------
------------------- --------- -- ---------------------------
---
-------------------- ----- ---- -- -
----- - ------- --- - - ----
--- ---- - ---
-------------- ----- -- -
---- -- ------
---
------------- -- -- -
---- - -----------------
-- ------- --- ------ -- --- --- --------- - -- ---- ----- - ---- --
----- -- - ----------------------
-- ---- -------- - ---------------------- -------
-------------------------------
----- ---------
-------- -
---
----- ----
-
----
-
----------
---
---此外，还需要将 redux-publish-action 的 middleware 添加到 store 中。请务必在调用 createStore 方法时添加：
const store = createStore( rootReducer, applyMiddleware(thunk, publishActionMiddleware) );
##总结
通过本文，你已经学会了如何使用 redux-publish-action 提升开发效率。对于需要频繁调用异步 action 的应用场景，使用 redux-publish-action 可以大幅度减少代码量，让你的代码更加简洁和易读。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006700fe361a36e0bce8d58