什么是 Redaxe？
Redaxe 是一个用于状态管理的 npm 包。它基于 Redux，并提供了一些便利和更好的封装。
安装
在使用 Redaxe 之前，需要先安装它。使用 npm 进行安装：
npm install redaxe --save
如何使用 Redaxe？
在使用 Redaxe 之前，需要先了解 Redux。如果你已经熟悉 Redux，那么 Redaxe 的使用会更加轻松。
创建 store
使用 Redaxe 创建一个 Redux store 与使用 Redux 创建 store 并没有什么区别。我们需要使用 createStore 函数来创建 store。
import { createStore } from 'redaxe';
const store = createStore(reducer);创建 action
在 Redaxe 中，我们可以使用 action 函数来创建 action，而不是手动编写 actions。
import { action } from 'redaxe';
export const increment = action('increment');
export const decrement = action('decrement');创建 reducer
我们依然需要一个 reducer 来处理 state 的变化。在 Redux 中，我们通常手动编写 reducer 函数。在 Redaxe 中，我们可以使用 handleActions 函数来自动生成 reducer 函数。
-- -------------------- ---- ------- ------ - ------------- - ---- --------- ------ - ---------- --------- - ---- ------------ ----- ------------ - - ------ -- -- ------ ----- ------- - --------------------------- - ------------ ----- -- -- ------ ----------- - - --- ------------ ----- -- -- ------ ----------- - - --- ---
连接组件
在 Redux 中，我们使用 connect 函数来连接 React 组件与 Redux store，并使用 mapStateToProps 和 mapDispatchToProps 函数来将 state 和 actions 传递给组件。
在 Redaxe 中，我们可以使用 withState 和 withActions 函数来连接组件，并使用 property 函数来获取 state 和 actions。
-- -------------------- ---- -------
------ - ---------- ------------ -------- - ---- ---------
----- ------- - -- ------ ---------- --------- -- -- -
-----
--------------
------- ------------------------------
------- ------------------------------
------
--
------ ------- ---------------------------- ---------------------- ---------------------额外功能
在 Redaxe 中，我们还提供了一些额外的功能。
异步 action
在 Redux 中，我们通常使用 redux-thunk 或 redux-saga 来处理异步 action。在 Redaxe 中，我们可以使用 asyncAction 函数来创建异步 action。
import { asyncAction } from 'redaxe';
export const loadData = asyncAction('loadData', () => {
return Promise.resolve('data');
});Redux DevTools
在 Redaxe 中，我们默认启用了 Redux DevTools。你可以在 Chrome 或 Firefox 中安装 Redux DevTools 扩展程序，用于调试和记录 state 的历史变化。
总结
现在你已经学会了使用 Redaxe 来管理状态了。相比 Redux，使用 Redaxe 可以更加方便和快捷地编写 React 应用程序。希望这篇文章可以帮助你更好地了解和使用 Redaxe。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055cbf81e8991b448da549