connectField(component[, options])

Provides form management related props.

The connectField helper is a component wrapper, that provides various props related to the form management. It also adds the 'Field' suffix to the name of the wrapped component.

The table below lists all of the guaranteed props that will be passed to the wrapped component:

changedboolHas field changed?
disabledboolIs field disabled?
errorobjectField scoped part of validation error.
errorMessagestringField scoped validation error message.
fieldobjectField definition from schema.
fieldsarrayOf(string)Subfields names.
fieldTypefuncField type.
idstringField id - given or random.
labelstringField label.
namestringField name.
onChangefunc(value, [name])Change field value.
placeholderstringField placeholder.
showInlineErrorbooleanShow inline error?
valueanyField value.

The connectField function accepts two arguments: the first one is a component and the second one is an options object.

The table below lists all available options:

initialValueboolInitial value check. If truthy, then after the first render defaultValue is set as value if no value is provided (undefined).
kind'leaf' or 'node'Defines field type. If you are not sure which one to use, use node.

changedKeys(root, valueA, valueB)

Returns an array of changed keys between valueA and valueB, where root is the root key.

import { changedKeys } from 'uniforms';
const arrayOfChangedKeys = changedKeys(root, valueA, valueB);

Note: For more examples, see changedKeys tests.


Removes all uniforms-related props.

import { filterDOMProps } from 'uniforms';
const nonUniformsProps = filterDOMProps(props);

filterDOMProps.register(propA, propB, propC ...)

Registers additional props to be filtered.

If you want to filter additional props, then you have to register it.

import { filterDOMProps } from 'uniforms';
filterDOMProps.register(propA, propB, propC /* ... */);


Returns an array containing already registered props.

import { filterDOMProps } from 'uniforms';
filterDOMProps.register(propA, propB, propC /* ... */);
filterDOMProps.registered; // ['propA', 'propB', ...]

joinName([null, ] nameA, nameB, nameC, ...)

Safely joins partial field names. When the first param is null, returns an array. Otherwise, returns a string.

If you create a custom field with subfields, then it's better to use this helper.

import { joinName } from 'uniforms';
const joinedNameArray = joinName(null, nameA, nameB, nameC /* ... */);
const joinedNameString = joinName(nameA, nameB, nameC /* ... */);


Generates random ID, based on given prefix. (It's rather an internal helper, but it's still exported.)

Use it, if you want to have some random but deterministic strings. If no prefix is provided, the 'uniforms' prefix will be applied.

import { randomIds } from 'uniforms';
const predictableRandomIdGenerator = randomIds(prefix);
const predictableRandomIdA = predictableRandomIdGenerator();
const predictableRandomIdB = predictableRandomIdGenerator();