mand-mobile/components/drop-menu
Shawn Xu d8dfc33f5b
fix: supplement safe-area padding and remove unused (#626)
2019-12-26 10:51:41 +08:00
..
demo example: remove old codesandbox & fix en title 2018-12-13 20:04:48 +08:00
test test: update test cases 2019-01-18 17:48:18 +08:00
README.en-US.md doc: update preview links 2019-01-29 16:31:24 +08:00
README.md doc: update preview links 2019-01-29 16:31:24 +08:00
component.js Initial commit 2018-03-26 16:04:04 +08:00
index.vue fix: supplement safe-area padding and remove unused (#626) 2019-12-26 10:51:41 +08:00

README.en-US.md

title preview
DropMenu https://didi.github.io/mand-mobile/examples/#/drop-menu

Drop-down menu is for list filtering

Import

import { DropMenu } from 'mand-mobile'

Vue.component(DropMenu.name, DropMenu)

Code Examples

API

DropMenu Props

Props Description Type Default Note
data data source Array<{text, disabled, options, ...}> [] disabled is whether to disable a button or not; the type of options is Array<{text, disabled, ...}>
default-value initial value Array [] -
option-render return rendering contents of each option Function({text, disabled, ...}):String - vue 2.1.0+ can use slot-scoperefer to Radio

DropMenu Methods

getSelectedValue(index): listItem

Get selected value of a barItem

Parameters Description Type Default
index index of barItem Number -

Returns

Props Description Type
listItem data of listItem Object: {text, disabled, options, ...}
getSelectedValues(): listItems

Get selected values of all barItem

Returns

Props Description Type
listItems dataset of listItem Array<{text, disabled, options, ...}>

DropMenu Events

@change(barItem, listItem)

Select some event

Props Description Type
barItem data of barItem Object: {text, disabled, options, ...}
listItem data of listItem Object: {text, disabled, ...}
@show()

Show events on drop-down menu

@hide()

Hide events on drop-down menu