antd - Form, Form.Item, 如何结合隐藏文本域使用?

问题描述

问 题

Form怎么把隐藏文本域结合起来.
例:

const hideInputs = React.creatClass({
    render(){
        return(
            <div>
                <input id="1" name="name1" type="hidden" />
                ...//可能有多个
            </div>
        )
    }
})

因为我这个组件是引用原来js的组件, 所以格式大致就是这种, 要怎么能结合到Form中,
在form.validateFields时能够取到所有隐藏文本域的值.

解决方案

方法一,
(上周五更新)找到一种方法,
每次在componentWillUnmount的时候, 把组件的input:hidden值存入一个对象, 在外部提交表单的时候, 获取hideInputs 实例,

.validateFields((err, fvalues) => {
    $.extend(fvalues, 对象);
})

但是不太"优雅"...

方法二, antd自定义表单控件

自定义或第三方的表单控件，也可以与 Form 组件一起使用。只要该组件遵循以下的约定：
1.提供受控属性 value 或其它与 valuePropName 的值同名的属性。
2.提供 onChange 事件或 trigger 的值同名的事件。

之前看文档没看到, 感谢大神@yesmeck提供思路.
因为我这个组件是由多个input:hidden组成的, 所以把它们封装在一个对象,
在onChange中获取实时结果集.即可通过getFieldDecorator 去包装组件.

这篇关于antd - Form, Form.Item, 如何结合隐藏文本域使用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！