@sishuguojixuefu/react-native-form/dist/Form.js

私塾动态表单组件

"use strict";
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const react_native_1 = require("react-native");
const antd_mobile_rn_1 = require("@sishuguojixuefu/antd-mobile-rn");
const rc_form_1 = require("rc-form");
const components_1 = __importDefault(require("./components"));
const getFieldDecorator_1 = __importDefault(require("./utils/getFieldDecorator"));
class Form extends react_1.Component {
    constructor(props) {
        super(props);
        // 兼容单个child
        this._getChilds = () => {
            const { children } = this.props;
            let childs = children;
            if (children && !children.length) {
                childs = [children];
            }
            return childs;
        };
        this._onChange = () => {
            react_native_1.DeviceEventEmitter.emit('SsDynamicFormValueChanged', {
                values: this.props.form.getFieldsValue(),
            });
        };
        // 业务驱动
        const childs = this._getChilds();
        if (childs && childs.length) {
            childs.forEach((item) => {
                if (item.props.custom) {
                    const { id, initialValue, rules } = item.props;
                    this[id] = getFieldDecorator_1.default(props.form, id, initialValue, rules, props.options);
                }
            });
        }
    }
    render() {
        const { items, renderHeader, renderFooter, form, noBorder, style } = this.props;
        const childs = this._getChilds();
        return (react_1.default.createElement(antd_mobile_rn_1.List, { renderHeader: renderHeader, renderFooter: renderFooter, style: [styles.container, style], noBorder: noBorder },
            items && items.length
                ? items.map(item => {
                    if (Object.keys(components_1.default).indexOf(item.componentName) >= 0) {
                        return react_1.default.createElement(components_1.default[item.componentName], {
                            key: item.props.id,
                            form,
                            onChange: () => this._onChange(),
                            ...item.props,
                        });
                    }
                    return null;
                })
                : null,
            childs && childs.length
                ? childs.map((item, index) => {
                    const child = react_1.default.cloneElement(item, {
                        key: item.props.id || index.toString(),
                        form,
                        id: item.props.id,
                        onChange: () => this._onChange(),
                        ...item.props,
                    });
                    return item.props.custom ? this[item.props.id](child) : child;
                })
                : null,
            react_1.default.createElement(react_native_1.View, { style: { height: noBorder ? 1 : 0 } })));
    }
}
Form.defaultProps = {
    noBorder: true,
};
const styles = react_native_1.StyleSheet.create({
    container: {
        backgroundColor: '#ffffff',
        flex: 1,
    },
});
exports.default = rc_form_1.createForm({})(Form);
//# sourceMappingURL=Form.js.map