useValueEditor()
useValueEditor(
props
):object
This hook is primarily concerned with multi-value editors like date range pickers, editors for 'in' and 'between' operators, etc.
Parameters
Parameter | Type |
---|---|
props | UseValueEditorParams |
Returns
object
The value as an array (valueAsArray
) and a change handler for
series of editors (multiValueHandler
).
NOTE: The following logic only applies if skipHook
is not true
. To avoid
automatically updating the value
, pass { skipHook: true }
.
If the value
is an array of non-zero length, the operator
is not one of
the known multi-value operators ("between", "notBetween", "in", "notIn"), and
the type
is not "multiselect", then the value
will be set to the first
element of the array (i.e., value[0]
).
The same thing will happen if inputType
is "number" and value
is a string
containing a comma, since <input type="number">
doesn't handle commas.
multiValueHandler()
multiValueHandler: (
val
,idx
) =>void
An update handler for a series of value editors, e.g. when operator is "between". Calling this function will update a single element of the value array and leave the rest of the array as is.
Parameters
Parameter | Type | Description |
---|---|---|
val | any | The new value for the editor |
idx | number | The index of the editor (and the array element to update) |
Returns
void
parseNumberMethod
parseNumberMethod:
ParseNumberMethod
Evaluated parseNumber
method based on parseNumbers
prop. This property ends up
being the same as the parseNumbers
prop minus the "-limited" suffix, unless
the "-limited" suffix is present and the inputType
is not "number", in which case
it's set to false
.
valueAsArray
valueAsArray:
any
[]
Array of values for when the main value represents a list, e.g. when operator is "between" or "in".
Examples
// Consider the following rule:
`{ field: "f1", operator: "in", value: ["twelve","fourteen"] }`
// If `operator` changes to "=", the value will be reset to "twelve".
// Consider the following rule:
`{ field: "f1", operator: "between", value: "12,14" }`
// If `operator` changes to "=", the value will be reset to "12".
Defined in
packages/react-querybuilder/src/hooks/useValueEditor.ts:47
API documentation is generated from the latest commit on the main
branch. It may be somewhat inconsistent with official releases of React Query Builder.