接口数据加载
可以通过自定义属性fetch
加载异步数据并赋值给指定属性
类型
ts
type Fetch = string | {
//接口地址
action: String | ((rule: object,api: object)=>Promise<any>);
//异步数据插入的位置,例如:'options', 'props.options'
to?: String;
//解析接口返回的数据,返回最终数据. 默认取 `res.data`
parse?: String | ((body: any, rule:Rule, fapi:fApi) => any);
//请求方式, 默认 GET
method?: String;
//调用接口附带数据
data?: Object;
//调用接口附带数据的提交方式,默认为 `formData`
dataType?: 'json';
//自定义 header 头信息
headers?: Object;
//接口请求失败回调
onError?: (e: Error | ProgressEvent) => void;
} | ((rule, api)=>object)
type Fetch = string | {
//接口地址
action: String | ((rule: object,api: object)=>Promise<any>);
//异步数据插入的位置,例如:'options', 'props.options'
to?: String;
//解析接口返回的数据,返回最终数据. 默认取 `res.data`
parse?: String | ((body: any, rule:Rule, fapi:fApi) => any);
//请求方式, 默认 GET
method?: String;
//调用接口附带数据
data?: Object;
//调用接口附带数据的提交方式,默认为 `formData`
dataType?: 'json';
//自定义 header 头信息
headers?: Object;
//接口请求失败回调
onError?: (e: Error | ProgressEvent) => void;
} | ((rule, api)=>object)
注意
- 当
fetch
为字符串时,数据会默认赋值给rule.options
- 可以配置表单配置的
options.beforeFetch
方法在请求前处理规则,例如设置token
示例
通过接口加载数据
通过自定义方法加载数据
重写内置的请求方法
通过重写 formCreate.fetch
方法即可修改内部用于请求的方法,例如:
js
formCreate.fetch = (options) => {
fetch(options.action, {
headers: options.headers,
method: options.method,
}).then(res=>{
res.json(data=>{
options.onSuccess(data);
})
}).catch(e=>{
options.onError(e);
})
}
formCreate.fetch = (options) => {
fetch(options.action, {
headers: options.headers,
method: options.method,
}).then(res=>{
res.json(data=>{
options.onSuccess(data);
})
}).catch(e=>{
options.onError(e);
})
}