form 支持配置验证错误提示

This commit is contained in:
liaoxuezhi 2019-07-03 16:15:48 +08:00
parent 15e67e9968
commit 9c29427fec
4 changed files with 11 additions and 5 deletions

View File

@ -74,6 +74,7 @@ amis 页面是通过 JSON 配置出来的,是由一个一个渲染模型组成
- [Chart](./renderers/Chart.md): 图表渲染器
- [Collapse](./renderers/Collapse.md): 折叠器
- [Carousel](./renderers/Carousel.md): 轮播图
- [Alert](./renderers/Alert.md): 提示框
- [Audio](./renderers/Audio.md): 音频播放器
- [Video](./renderers/Video.md): 视频播放器
- [Table](./renderers/Table.md): 表格展示

View File

@ -1,11 +1,14 @@
export default {
$schema: "https://houtai.baidu.com/v2/schemas/page.json#",
title: "表单验证示例",
toolbar: "<a target='_blank' href='/docs/renderers#formitem'>文档</a>",
toolbar: "<a target='_blank' href='/docs/renderers/Form/FormItem'>文档</a>",
body: [
{
type: "form",
autoFocus: false,
messages: {
'validateFailed': '请仔细检查表单规则,部分表单项没通过验证'
},
title: "表单",
actions: [
{

View File

@ -100,6 +100,7 @@ export interface FormProps extends RendererProps, FormSchema {
fetchFailed?: string;
saveSuccess?: string;
saveFailed?: string;
validateFailed?: string;
};
}
@ -398,10 +399,11 @@ export default class Form extends React.Component<FormProps, object> {
submit(fn?:(values:object) => Promise<any>):Promise<any> {
const {
store
store,
messages
} = this.props;
return store.submit(fn, this.hooks['validate' || []]);
return store.submit(fn, this.hooks['validate' || []], messages && messages.validateFailed);
}
reset() {

View File

@ -256,7 +256,7 @@ export const FormStore = ServiceStore
}
});
const submit:(fn?:(values:object) => Promise<any>, hooks?: Array<() => Promise<any>>) => Promise<any> = flow(function *submit(fn:any, hooks?: Array<() => Promise<any>>) {
const submit:(fn?:(values:object) => Promise<any>, hooks?: Array<() => Promise<any>>, failedMessage?: string) => Promise<any> = flow(function *submit(fn:any, hooks?: Array<() => Promise<any>>, failedMessage?: string) {
self.submited = true;
self.submiting = true;
@ -264,7 +264,7 @@ export const FormStore = ServiceStore
let valid = yield validate(hooks);
if (!valid) {
(getRoot(self) as IRendererStore).notify('error', '表单验证失败,请仔细检查');
(getRoot(self) as IRendererStore).notify('error', failedMessage || '表单验证失败,请仔细检查');
throw new Error('验证失败');
}