API
Variables
Props
| name | type | default | description | required version |
| value | boolean | visibility of popup, use v-model for binding | -- | |
| height | string | auto | popup height, works when position is top or bottom | -- |
| hide-on-blur | boolean | true | if closing popup when mask being clicked | -- |
| is-transparent | boolean | false | if using transparent background | v2.1.1-rc.9 |
| width | string | auto | if you want to set 100% width, you should use this prop. only works when position is left or right | v2.2.1-rc.6 |
| position | string | bottom | popup position, shoule be one of ['left', 'right', 'top', 'bottom'] | v2.2.1-rc.6 |
| show-mask | boolean | true | whether show mask | v2.2.1-rc.6 |
| popup-style | object | popup style | v2.5.2 | |
| hide-on-deactivated | boolean | true | whether hide popup on deactived event when using keep-alive | v2.5.5 |
| should-rerender-on-show | boolean | false | whether rerender body on show | v2.9.0 |
| should-scroll-top-on-show | boolean | false | whether scroll top on show，add class vux-scrollable if you customize the scrollable div | v2.9.0 |
Events
| name | params | description | required version |
| @on-hide | -- | emits when then popup is closed | -- |
| @on-show | -- | emits when the popup shows | -- |
| @on-first-show | -- | emits at the first time the popup shows | -- |
Slots
| name | description | required version |
| default | content body | -- |
Variables
| name | default | description | inherited name |
| @popup-picker-header-text-color | #04BE02 | -- | @theme-color |
| @popup-picker-header-bg-color | #fbf9fe | -- | |
| @popup-picker-header-font-size | 16px | -- | |
| @popup-picker-header-cancel-text-color | #828282 | -- | |
| @popup-background-color | #eee | -- | |
| @popup-header-height | 44px | -- | |
| @popup-header-bg-color | #fbf9fe | -- | |
| @popup-header-font-size | 16px | -- | |
| @popup-header-left-text-color | #828282 | -- | |
| @popup-header-right-text-color | #04BE02 | -- | @theme-color |
| @popup-header-title-text-color | #222 | -- | |
| @popup-header-left-text-padding | 15px | -- | |
| @popup-header-right-text-padding | 15px | -- |
Contributors
Contributors
Total commits quantity: 52，Total contributors quantity: 5
KwanairylandClay万刚Lin SenChangelog
Releases
- v2.9.1 [fix] fixed popup has black border on the right #2651
- v2.9.0 [feature] support prop:should-rerender-on-show for forcing rerendering #2598
- v2.9.0 [feature] support prop:should-scroll-top-on-show for forcing scrolling top #2598
- v2.5.12 [fix] clean vux-modal-open on beforeDestroy and deactivated #1921
- v2.5.11 [fix] add vux-modal-open only when global config:$layout is VIEW_BOX #1893
- v2.5.10 [fix] Fix class helper typo issue #1893
- v2.5.9 [fix] Fix layout errors when body not set 100% width #1867
- v2.5.5 [feature] Auto hide popup on deactived #1774
- v2.5.2 [feature] Add prop:popup-style #1656
- v2.3.7 [fix] Fix missing mask when initial value is true #1555
- v2.3.3 [enhance] Set max-height:100% by default
- v2.3.3 [feature] Support prop:max-height
- v2.3.3 [fix] disable mask scrolling on mobile #1475 @xiaobinhong1
- v2.2.2 [fix] Fix mask closing issue in some situation. #1312
- v2.2.1-rc.6 [fix] Fix popup classname get lost
- v2.2.1-rc.6 [feature] Support prop:show-mask
- v2.2.1-rc.6 [feature] Support prop:position
- v2.2.1-rc.6 [feature] Support prop:width
- v2.1.1-rc.11 [fix] Fix wrong overflowScrolling when mask is disabled
- v2.1.1-rc.9 [enhance] Better mask transition
- v2.1.1-rc.9 [feature] Support tranparent background
- v2.1.1-rc.9 [feature] Support less variable: @popup-background-color
- v2.1.1-rc.6 [fix] Fix wrong setting of overflow-scrolling when using multi popup on Safari #1015 @think2011
- v2.1.1-rc.1 [fix] Fix overflow-scrolling setting in safari #311 @linhaobin