picker

Text picker component. This component displays a set of text; clicking the middle text item triggers a selection event, while sliding operations allow all text items to scroll into view.

Warning

The functionality of the picker component has not been verified and is unmaintained.

Properties

set

All strings in the range property value will be displayed in the picker component. Users can operate the picker component to scroll through or select these strings.

For the indexing method of strings in the range property value, refer to the index property.

set

Configures whether the picker component displays in a loop (i.e., infinitely). When this property value is true, loop display is enabled, defaulting to false.

listen

Watches the text of the currently selected item; this listener is triggered when the selected item changes during a scroll operation. The functionality of this property can also be achieved using the on:index="handle(rangeData[$event])" method.

get • set • listen

The index value of the selected item in the picker component. The indexing rule is: the index value of the first string item in the range property array is $0$, and the indices of other strings increment by one. Setting the index property can specify the selected item of the picker component, and you can also watch for changes to this property to detect selection changes caused by scrolling operations.

get • set • listen

The scroll property allows you to watch scroll operations, and you can also manipulate the picker component in code to display scrolling effects. Similar to an aligned list component, the scroll operation of the picker also aligns to the nearest item.

Since the picker component only supports vertical mode, the x field of the scroll property value is always 0.

listen

Use the scrolled property to listen for whether the picker is in a scrolling state. An emitted event value of true indicates that the picker is scrolling; otherwise, it means the picker has stopped scrolling.

Both scrolling operations generated by user touch and scrolling via the scroll property will trigger the scrolled event. When the picker stops from a scrolling state, the parameter value of the scrolled event is false.

set

Sets the damping coefficient for the picker scrolling animation. The valid range is $[0.1, 50]$ (unsupported values will be automatically adjusted to the upper or lower limits), with a default value of $1.5$. A larger damping coefficient will cause the animation to stop faster, while the default damping coefficient value can produce an inertial effect with a longer distance and duration.

The damping coefficient should be set as a constant and not modified; modifying the damping coefficient will not affect the rebound animation.