简介
@huygn/redux-bundler 是一个基于 redux 的状态管理库，旨在提供一种轻量级且易于使用的方式来管理状态。该库优化了 redux 的使用方式，使用户能够更快地搭建复杂的前端应用。
安装
首先需要安装几个依赖：
$ npm install redux redux-thunk @huygn/redux-bundler
使用
在你的 store.js 文件中，你需要先定义你的 AppWrapper 组件：
-- -------------------- ---- ------- ------ ----- ---- ------- ------ - ----------------------- - ---- ---------------------- ------ ----- ---------- - -- -------- -- -- --------------------- -- --- ----- ----- ------------ - - --------- --- - -- --------- ----- ---------------- - ----- -- -------------- ------ ----- -------------- - ----------------------------------------- -------- -- --------- -- ------- ----- --------- - ----------- ------ ----- -------- - ------- -- -- ----- ---------- -------- ------- -- -------- ------ ------- ------ - ------------- ------- -- - ------ ------------- - ---- ---------- ------ - --------- --------- - ------------------ -------------- - - -------- ------ ----- - -展开代码
然后，在根组件中，你需要初始化你的 store，并将 AppWrapper 组件传入其 provider 中：
-- -------------------- ---- ------- ------ ----- ---- ------- ------ -------- ---- ----------- ------ - -------- - ---- --------------- ------ ----------- ---- --------- ------ - ---------- - ---- -------------------------- ----- ----- - ------------- ---------------- --------- -------------- ------------ --- --------- --- ------------- ------------ ------------------------------- -展开代码
可以看到，在 AppWrapper 组件中，我们定义了一些初始状态的值，以及 selectors、actions 和 reducers，这些都组成了我们状态的一份个性化的定义。
使用 bundle
更直接的方式是使用 @huygn/redux-bundler 提供的 bundle。
-- -------------------- ---- ------- ------ - --------------- ------------------- - ---- ---------------------- ----- ------------- - - ----- ---------------- -------- ------ - - ------ -- -------- -- -- ------- -- - ------ ------------- - ---- ------------ ------ - --------- ------ ----------- - -- -------- ------------------ ----------- - --- - ---- -------- ------ - ------ -- -------- --- -------- ------ ----- - -- ------------ ----- -- -------------------------- -------------- ----- -- ---------------------------- ------------ -- -- -- ----- ----------- --- ------------- -- -- -- --------- ----- -- -- - -- ---- - - ----- -------------- - - ----- ----------------- -------- ------ - - ----- ---- -- ------- -- - ------ ------------- - ---- ----------- ------ - --------- ----- --------------- - ---- ------------- ------ - ----- ---- - -------- ------ ----- - -- -- ---------- ------- - - ------ ------- --------------- -------------- --------------- -- -- ------- --------------------- -- -- -------------- -- -- ------------------ -- -展开代码
这意味着，我们可以更好地把我们的状态拆分成组块，从而让我们的应用整洁简单。
结语
@huygn/redux-bundler 能够更有效地帮助你管理你的应用状态，帮助你建立更复杂的应用。在你的下一个前端项目中，不妨试试这款库来提高你的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668f5d9381d61a3540e97
