mirror of
https://gitee.com/baidu/amis.git
synced 2024-12-02 03:48:13 +08:00
补充文档
This commit is contained in:
parent
23e7eaa197
commit
477a34a43f
@ -20,6 +20,7 @@ amis 的配置最终会转成 React 组件来执行,所以如果只是想在
|
||||
},
|
||||
{
|
||||
"name": "mycustom",
|
||||
"asFormItem": true,
|
||||
"children": ({
|
||||
value,
|
||||
onChange,
|
||||
@ -41,6 +42,9 @@ amis 的配置最终会转成 React 组件来执行,所以如果只是想在
|
||||
|
||||
其中的 `mycustom` 就是一个临时扩展,它的 `children` 属性是一个函数,它的返回内容和 React 的 Render 方法一样,即 jsx,在这个方法里你可以写任意 JavaScript 来实现自己的定制需求,这个函数有两个参数 `value` 和 `onChange`,`value` 就是组件的值,`onChange` 方法用来改变这个值,比如上面的例子中,点击链接后就会修改 `mycustom` 为一个随机数,在提交表单的时候就变成了这个随机数,而 `data` 可以拿到其它控件的值,比如 `data.username`。
|
||||
|
||||
> 注意与 "children" 并列有个 "asFormItem" 属性,这个属性表示这个节点的渲染会自动包裹成表单项,包裹成表单项就能配置
|
||||
> "name"、"description"、"validation" 之类的跟表单项有关的配置了。包括其中的 value 和 onChange 自动会跟 name 关联等功能,跟下面 `@FormItem` 注解是一个功能。
|
||||
|
||||
与之类似的还有个 `component` 属性,这个属性可以传入 React Component,如果想用 React Hooks,请通过 `component` 传递,而不是 `children`。
|
||||
|
||||
这种扩展方式既简单又灵活,但它是写在配置中的,无法在其他地方复用,也无法在可视化编辑器里编辑,如果需要复用或在可视化编辑器中使用,请使用下面的「注册自定义类型」方式:
|
||||
|
@ -71,6 +71,11 @@ export interface SubFormControlSchema extends FormBaseControl {
|
||||
*/
|
||||
btnLabel?: string;
|
||||
|
||||
/**
|
||||
* 新增按钮文字
|
||||
*/
|
||||
addButtonText?: string;
|
||||
|
||||
/**
|
||||
* 新增按钮 CSS 类名
|
||||
*/
|
||||
@ -339,7 +344,8 @@ export default class SubFormControl extends React.PureComponent<
|
||||
draggableTip,
|
||||
addable,
|
||||
removable,
|
||||
minLength
|
||||
minLength,
|
||||
addButtonText
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
@ -422,7 +428,7 @@ export default class SubFormControl extends React.PureComponent<
|
||||
}
|
||||
>
|
||||
<Icon icon="plus" className="icon" />
|
||||
<span>{__('SubForm.add')}</span>
|
||||
<span>{__(addButtonText || 'SubForm.add')}</span>
|
||||
</button>
|
||||
) : null}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user