默认情况下,本节所有 API 的导出包名为:@modern-js/runtime/model
。
如果是在 Modern.js 以外单独集成 Reduck,导出包名为:@modern-js-reduck/react
。
一个异步函数类型的 Effect,通常有三种需要处理的状态: 请求中、请求成功、请求处理失败。这些状态处理的方式,就是编写对应的 Action 函数(pending、fulfilled、rejected)。
借助 handleEffect
API,我们可以生成默认的 Action 函数来处理异步请求各个阶段的不同结果。handleEffect
生成的 Action 返回的 State 的结构如下:
interface State {
result: any; // 存储 fulfilled 状态的返回结果
pending: boolean; // 请求是否结束
error: string; // 请求失败的结果
}
interface EffectActions {
pending: Action;
fulfilled: Action;
rejected: Action;
}
interface Config {
ns?: string;
result?: string | false;
error?: string | false;
pending?: string | false;
combineMode?: 'merge' | 'replace';
omitResultNamespace?: boolean;
}
function handleEffect(config: Config): EffectActions;
ns
值命名的字段下。例如,ns
设置为 data
,返回的 State 结构为:interface State {
data: {
pending: boolean;
result: any;
error: string;
};
}
"result"
。该参数对应存储异步请求 fulfilled 状态结果的字段名称。例如,设置 result
为 "items"
,返回的 State 结构为:interface State {
items: any; // 默认的 result -> items
pending: boolean;
error: string;
}
result
为 false
,返回的 State 结构中不存在 result
:
interface State {
pending: boolean;
error: string;
}
pending:默认值为 "pending"
。改变返回 State 中的 pending
字段名。用法同上。
error: 默认值为 "error"
。改变返回 State 中的 error
字段名。用法同上。
combineMode:默认值为 "merge"
。获取 fulfilled 状态的返回数据后,对 result
的处理方式:merge(合并)和 replace(替换)。这里能自动处理的数据类型也仅限为简单的对象或者数组类型。
[].concat(lastData, currentData)
;数据为对象类型,内部操作类似于 {...lastData, ...curData}
。omitResultNamespace:默认值为 "false"
。当异步请求的结果为对象类型,希望把该结果直接挂载到 Model 的 State 上,而不是挂载到 "result"
上,可以设置为 true。例如:
// 一个异步请求得到的数据为一个对象:{user: 'xx', email: 'xx'},
// 配置 handleEffect({ omitResultNamespace: true })
// 则得到的 State 结构如下:
{
user: 'xx',
email: 'xx',
pending: false,
error: null,
}
分别处理 pending、fulfilled、rejected 三种状态的 Action 组成的对象。