Document Component

Lib

Dropdown

Description

importimport Dropdown from "@lib/component/Dropdown";

Examples

Basic

Cách sử dụng cơ bản

Props

Property
Description
Type
Default
isOpen
Tham số truyền vào khi muốn điểu khiển dropdown đóng mở theo trạng trái isOpen truyền vào
boolean
-
toggleEvent
Xác định event đóng mở của dropdown có 2 loại là click và hover
click | hover
click
blurOnclick
Tham số truyền vào khi muốn blur dropwdown khi click vào bên trong menu
function()
empty function
isOpenOnMount
Trạng thái ban đầu đóng hoặc mở dropdown
boolean
-
className
className Dropdown
ReactNode
-

Dropdown.Toggle

Thành phần Toggle của Dropdown

Property
Description
Type
Default
className
className DropdownToggle
string
-

Dropdown.Menu

Thành phần Menu của Dropdown

Property
Description
Type
Default
className
className DropdownMenu
string
-
position
style vị trí của menu có chỉ có 3 lựa chọn là top, right, left
CSSProperties
{top: "120%", left: "auto", right: "auto"}
transitionType
Loại animate muốn sử dụng cho dropdown chỉ có 3 loại là zoomIn, scaleY, slideDown
zoomIn | scaleY | slideDown
slideDown
transitionProperty
tham số truyền vào một số thuộc tính như thời gian hoàn thành animate, timming function dành cho animate, tranformOrigin
CSSProperties
{transitionDuration: "150ms", transitionTimingFunction: "ease-in-out", transformOrigin: "top"}