状态管理方案

[wssgcg1213]

No description provided.

[luhc228]

背景

回顾 ICE 1.x/2.x 以及 rax-app 3.x，两个框架状态管理方案都是在 icestore (react-redux) 基础上，支持自动包裹全局和页面级别的 <Provider />、按需开启状态管理等。但从 issue 和答疑的反馈来看，目前开发者在使用状态管理方案的时候还是有一定的问题：

• Provider 没有包上，报错：Cannot read properties of null (reading 'store') （答疑较多，一般都是页面路由嵌套二级以上）
• 嵌套两层以上页面的情况下不会自动包裹 Provider，一般开发者可能没有意识到我们的最佳实践，之前设计上也有点复杂
• 开发者写的 store.ts 的目录不对，导致状态管理没有开启

另外，icestore 是依赖 redux 和 react-redux，体积相对较大（约80 kb），在无线端场景下可能导致 bundle 体积过大的问题。

方案

针对上述提及答疑反馈的问题，新版本的状态管理方案设计上可以简化成：

1. 默认只包裹全局的 Provider，页面级别的 Provider 不自动包裹，如果需要则自行包裹 Provider（原因：大部分的 model 写在 src/models 目录即可，并在 src/store.ts 中引入即可，框架默认引入 src/store.ts 并自动在外层包裹 Provider）
2. plugin-store 默认不内置，由开发者自行在 ice.config.mts 中 plugins 字段中引入，不再去判断是否有存在约定 store 文件后再去开启状态管理

针对体积问题，可以提供两种方案：

1. 基于 React Hooks（icestore-next / hox），推荐无线应用使用此方案
2. 基于 Redux（icestore），推荐中后台复杂应用使用此方案

[luhc228]

TODO:

• plugin-store 支持全局初始状态 initialStates

// src/app.ts
export const storeInitialStates = {};

- [ ] plugin-hook-store 支持全局初始状态 initialStates
- [ ] plugin-hook-store 支持 resetPageState

• @ice/hooks-store API 命名讨论：useHooks or useHook ?

[luhc228]

讨论：切换页面再次进入原页面后是否需要重新初始化页面状态？

用户对于重新初始化页面状态还是有诉求的：dvajs/dva#907

ICE 2 的默认行为是会重新初始化页面状态，用户可以通过配置关闭此行为。详见

不过主流的状态管理方案一般没有自动重置状态的行为（仅维护一个全局状态），需要用户手动添加 reset 逻辑

• https://github.com/abhiaiyer91/redux-reset
• 如何清空 redux 信息？ dvajs/dva#907 (comment)

[wssgcg1213]

讨论：切换页面再次进入原页面后是否需要重新初始化页面状态？

用户对于重新初始化页面状态还是有诉求的：dvajs/dva#907

ICE 2 的默认行为是会重新初始化页面状态，用户可以通过配置关闭此行为。详见

不过主流的状态管理方案一般没有自动重置状态的行为（仅维护一个全局状态），需要用户手动添加 reset 逻辑

• https://github.com/abhiaiyer91/redux-reset
• 如何清空 redux 信息？ dvajs/dva#907 (comment)

SPA 中, 我们把多个页面组合成一个 Application, 这个数据是 App 的数据，所以不应该清空状态。
如果业务需要在切换页面的时候重置状态, 这个属于业务逻辑范畴，提供 API 和生命周期回调让业务自己组合就可以了。