介绍
create-observable-thunk 是一个用于创建动作（Action）和异步操作（Thunk）的小型库，它是基于 Redux 和 RxJS 技术栈构建的。使用 create-observable-thunk，您可以轻松地处理异步操作、副作用和状态更新等操作，并保持应用程序的一致性和可维护性。
安装
在您的项目目录下，通过 npm 命令安装 create-observable-thunk：
npm install create-observable-thunk
或者使用 yarn：
yarn add create-observable-thunk
使用
要使用 create-observable-thunk，您需要将其与 Redux Store 一起使用。在以下示例代码中，我们将从一个简单的计数器应用程序开始，该应用程序具有“增加”和“减少”计数器的按钮。
-- -------------------- ---- -------
------ - ------------ --------------- - ---- --------
------ - --------------------- - ---- --------------------------
------ - --------------- - ---- -------
-- ------ -----
----- --------- - ------------
----- --------- - ------------
-- -------
----- ------- - ------ - - ------ - -- ------- -- -
------ ------------- -
---- ----------
------ - --------- ------ ----------- - - --
---- ----------
------ - --------- ------ ----------- - - --
--------
------ ------
-
--
-- -------
----- --------- - -- -- -- ----- --------- ---
----- --------- - -- -- -- ----- --------- ---
-- ------ ---------- ------
----- -------------- - ------------------------------ ------- --------- -- -
------------- -- ---------------------- --------------
---
----- -------------- - ------------------------------ ------- --------- -- -
------------- -- ---------------------- --------------
---
-- -----
----- ----- - -------------------- ------------------------------------------------
-- -------- -------
------------------------------- ------ ---- ----
------------------------------- ------ ---- ----在上面的示例代码中，我们创建了一个 store 和一个 reducer，然后定义了常规的 Action 和相关的 createObservableThunk。我们使用 createObservablesMiddleware 将 createObservableThunk 和 Redux Store 集成在一起，并在 store.dispatch 中使用了这些异步操作。
进阶用法
如果您已经熟悉 RxJS，可以使用 createObservableThunk 操作符来更方便地创建异步操作。在下面的示例代码中，我们将展示如何使用 switchMap 操作符更方便地处理异步 HTTP 调用。
-- -------------------- ---- -------
------ - -- - ---- -------
------ - ----------- --------- - ---- -----------------
----- ------------- - ------------------------------ ------- --------- -- -
------ ------------
--------------- -- --------------------------
---------------- -- -
---------------------
------ -------
--
--
---在上面的示例代码中，我们使用了 switchMap 操作符来处理异步 HTTP 调用。state$ 参数是一个 RxJS 的 BehaviorSubject，可以用来订阅和更新应用程序状态。我们还使用了 catchError 操作符来捕获和处理常见的错误。
参考
create-observable-thunk 的 API 文档和更多示例，请访问其 GitHub 主页：
结论
create-observable-thunk 是一个非常有用的 npm 包，它可以帮助您轻松地处理异步操作和副作用，并以一致性和可维护性的方式更新应用程序状态。希望这篇文章能够帮助您更好地了解和使用 create-observable-thunk。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60057ae581e8991b448eb6c2