<Logic>







A <Logic>
can be used to optionally display their children. See the 'Logic Rules' section for more.
Use of <Logic>
<Logic rules={[]}>[any nodes to conditonally display]</Logic>
Logic rules
<Page>
s and <Logic>
can have rules, which is an array of conditional rules.
[
{
type: 'ConditionalRule',
target: { type: 'TargetByField', id: 'stable-field-id' },
comparison: '=',
matchesValue: 'chosen value',
},
{
type: 'ConditionalRule',
target: { type: 'TargetByField', id: 'stable-field-id2' },
comparison: '=',
matchesValue: 'chosen value',
},
]
In the array of rules all logic rules must match for a condition to be true.
<Logic>
's props
Prop | About | Type |
---|---|---|
hideInAnswerSummary | Whether to hide any answers below this. | boolean |
rules | An array of Conditional Rules. All rules need to pass for the condition to be valid. E.g.
| ConditionalRule[] |
id | Component Id. Must be unique within the form. | string |
meta | Arbitrary metadata on this node. This is useful when developing custom controls as it allows you to pass down metadata/extensions. | string |
childrenById | Used to indicate children ids of this component. If used in React this is non-editable. | string[] |
hasChildrenById | Non-editable. Used to indicate that this component can have children. | true |
hasTagsById | Non-editable. Used to indicate that this component isn't a form field with tags by id. | false |
isFormField | Non-editable. Used to indicate that this component isn't a form field. | false |
isMultichoice | Non-editable. Used to indicate that this component isn't a multichoice form field like | false |
type | Non-editable. Type of component of | "Logic" |