:: BASE_DOC ::
name | type | default | description | required |
---|
style | Object | - | CSS(Cascading Style Sheets) | N
custom-style | Object | - | CSS(Cascading Style Sheets),used to set style on virtual component | N
auto-close | Boolean | true | - | N
cancel-btn | String / Boolean / Object | true | Typescript:boolean \| string \| ButtonProps
| N
confirm-btn | String / Boolean / Object | true | Typescript:boolean \| string \| ButtonProps
,Button API Documents。see more ts definition | N
footer | Slot | - | see more ts definition | N
header | Boolean / Slot | true | see more ts definition | N
keys | Object | - | Typescript:KeysType
。see more ts definition | N
popup-props | Object | {} | popup properties。Typescript:PopupProps
,Popup API Documents。see more ts definition | N
title | String | '' | - | N
use-popup | Boolean | true | - | N
value | Array | - | Typescript:Array<PickerValue>
type PickerValue = string \| number
。see more ts definition | N
default-value | Array | undefined | uncontrolled property。Typescript:Array<PickerValue>
type PickerValue = string \| number
。see more ts definition | N
visible | Boolean | false | - | N
name | params | description |
---|
cancel | - | -
change | (value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )
| -
close | (trigger: TriggerSource)
| 1.0.1
。see more ts definition。type TriggerSource = 'overlay' \| 'cancel-btn' \| 'confirm-btn'
confirm | (value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )
| -
pick | (value: Array<PickerValue>, label: string, column: number, index: number)
| -
name | type | default | description | required |
---|
style | Object | - | CSS(Cascading Style Sheets) | N
custom-style | Object | - | CSS(Cascading Style Sheets),used to set style on virtual component | N
format | Function | - | Typescript:(option: PickerItemOption) => string
| N
options | Array | [] | Typescript:PickerItemOption[]
interface PickerItemOption { label: string; value: string \| number }
。see more ts definition | N
The component provides the following CSS variables, which can be used to customize styles.
Name | Default Value | Description
-- | -- | --
--td-picker-group-height | 400rpx | -
--td-picker-bg-color | @bg-color-container | -
--td-picker-border-radius | 24rpx | -
--td-picker-button-font-size | 32rpx | -
--td-picker-cancel-color | @font-gray-2 | -
--td-picker-confirm-color | @brand-color | -
--td-picker-indicator-bg-color | @bg-color-secondarycontainer | -
--td-picker-indicator-border-radius | 12rpx | -
--td-picker-mask-color-bottom | hsla(0, 0%, 100%, 0.4) | -
--td-picker-mask-color-top | hsla(0, 0%, 100%, 0.92) | -
--td-picker-title-color | @font-gray-1 | -
--td-picker-title-font-size | 36rpx | -
--td-picker-title-font-weight | 600 | -
--td-picker-title-line-height | 52rpx | -
--td-picker-toolbar-height | 116rpx | -
--td-picker-item-active-color | @font-gray-1 | -
--td-picker-item-color | @font-gray-2 | -
--td-picker-item-height | 80rpx | -