Custom Logic
Start of documentation contentUse of
Allows custom conditional rules in JavaScript with the onLogic
prop.
Intro
For technical reasons usage of Formally JSX has some constraints. These include being unable to conditionally render Formally JSX components.
Any <Logic>
(formerly <Conditional>
) or <Page rules={...}>
can
have additional custom logic provided. The function can be sync or
async, and it returns undefined
, true
, or false
.
Use of onLogic
The onLogic
callback is called for each field. In a Repeater
it will be
called on each repeated field.
You can return either...
- Return
true
: evaluate true, and we have enough form data to evaluate answers - Return
false
: evaluate false, and we have enough form data to evaluate answers - Return
undefined
: evaluate undefined to show that there's not enough form data to evaluate answers, so whether it would pass is ambiguous
import { Formally } from 'formally';
<Formally
onLogic={async ({
conditionResult,
formallyData,
valuesToBeTested,
allValues,
rules,
locale,
}) => {
// your custom logic goes here...
}}
/>;