Skip to main content

The Key Value component for Retool Mobile

Properties​

All properties for this object with supported data types or values. You can write JavaScript almost anywhere in Retool to manipulate or read property values.

allowTextWrapping​

Whether to wrap text.

Type boolean
Format True/False
Configurability Inspector
Defaultfalse
Examples
falsetrue

data​

The data.

Type string | number | boolean | object | array
Format Custom data
Configurability Inspector
Defaultnull

direction​

The layout of content.

Type string
Configurability Inspector
Allowed Values
ValueDescription
row

Horizontal row layout.

column

Vertical column layout.

Defaultnull

header​

The title text to display.

Type string
Configurability Inspector
Defaultnull

hidden​

Whether this object is hidden from view.

Type boolean
Format True/False
Configurability Inspector > Appearance > Hidden
Defaultfalse
Examples
falsetrue

rowVisibility​

A list of visible rows.

Type object
Configurability Inspector
Defaultnull

showSeparator​

Whether the show a separating line betweeen items.

Type boolean
Configurability Inspector
Defaultnull

valueHorizontalAlignment​

The text alignment of values.

Type string
Configurability Inspector
Allowed Values
ValueDescription
left

Align left.

right

Align right.

Defaultnull

valueWidth​

The width of the value column.

Type string
Configurability Inspector
Allowed Values
ValueDescription
75%

75% width.

50%

50% width.

25%

25% width.

Defaultnull

Methods​

JavaScript API methods for this object. You can write JavaScript almost anywhere in Retool and use methods to manipulate data and property values.

keyValue.setHidden()​

Set the hidden value to toggle whether the component is visible. Defaults to true without a parameter.

Definition
keyValue.setHidden(hidden)
Parameters

hidden​

Whether this object is hidden from view.

Type boolean
Format True/False
Default
false
Examples
true

Examples

Hide keyValue.

keyValue.setHidden(true);

Unhide keyValue.

keyValue.setHidden(false);

Events​

Events triggered by user interactions. You can configure event handlers in the IDE to trigger queries or other actions in response to events.

EventDescription