2018-01-29 18:57:20 +08:00
|
|
|
<script>
|
2018-01-31 10:30:09 +08:00
|
|
|
import RcDropdown from './src/index'
|
2018-01-29 18:57:20 +08:00
|
|
|
import DropdownButton from './dropdown-button'
|
|
|
|
// import warning from '../_util/warning'
|
|
|
|
import PropTypes from '../_util/vue-types'
|
2018-02-24 18:12:24 +08:00
|
|
|
import { cloneElement } from '../_util/vnode'
|
|
|
|
import { getOptionProps, getPropsData } from '../_util/props-util'
|
2018-01-29 18:57:20 +08:00
|
|
|
import getDropdownProps from './getDropdownProps'
|
|
|
|
const DropdownProps = getDropdownProps()
|
|
|
|
const Dropdown = {
|
|
|
|
props: {
|
|
|
|
...DropdownProps,
|
|
|
|
prefixCls: PropTypes.string.def('ant-dropdown'),
|
|
|
|
mouseEnterDelay: PropTypes.number.def(0.15),
|
|
|
|
mouseLeaveDelay: PropTypes.number.def(0.1),
|
|
|
|
placement: DropdownProps.placement.def('bottomLeft'),
|
|
|
|
},
|
|
|
|
model: {
|
|
|
|
prop: 'visible',
|
|
|
|
event: 'visibleChange',
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
getTransitionName () {
|
|
|
|
const { placement = '', transitionName } = this.$props
|
|
|
|
if (transitionName !== undefined) {
|
|
|
|
return transitionName
|
|
|
|
}
|
|
|
|
if (placement.indexOf('top') >= 0) {
|
|
|
|
return 'slide-down'
|
|
|
|
}
|
|
|
|
return 'slide-up'
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
render () {
|
|
|
|
const { $slots, prefixCls, trigger, disabled, $listeners } = this
|
|
|
|
const dropdownTrigger = cloneElement($slots.default, {
|
|
|
|
class: `${prefixCls}-trigger`,
|
|
|
|
disabled,
|
|
|
|
})
|
|
|
|
const overlay = $slots.overlay && $slots.overlay[0]
|
|
|
|
// menu cannot be selectable in dropdown defaultly
|
|
|
|
const overlayProps = overlay && getPropsData(overlay)
|
2018-02-05 14:16:55 +08:00
|
|
|
const selectable = (overlayProps.selectable !== undefined && overlayProps.selectable !== false) || false
|
2018-01-29 18:57:20 +08:00
|
|
|
const fixedModeOverlay = cloneElement(overlay, {
|
|
|
|
props: {
|
|
|
|
mode: 'vertical',
|
|
|
|
selectable,
|
2018-01-30 17:13:44 +08:00
|
|
|
isRootMenu: false,
|
2018-01-29 18:57:20 +08:00
|
|
|
},
|
|
|
|
})
|
|
|
|
const dropdownProps = {
|
|
|
|
props: {
|
|
|
|
...getOptionProps(this),
|
|
|
|
transitionName: this.getTransitionName(),
|
|
|
|
trigger: disabled ? [] : trigger,
|
|
|
|
},
|
|
|
|
on: $listeners,
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<RcDropdown
|
|
|
|
{...dropdownProps}
|
|
|
|
>
|
|
|
|
{dropdownTrigger}
|
|
|
|
<template slot='overlay'>
|
|
|
|
{fixedModeOverlay}
|
|
|
|
</template>
|
|
|
|
</RcDropdown>
|
|
|
|
)
|
|
|
|
},
|
|
|
|
}
|
|
|
|
|
|
|
|
Dropdown.Button = DropdownButton
|
|
|
|
export default Dropdown
|
2018-01-31 10:30:09 +08:00
|
|
|
export { DropdownProps }
|
2018-01-29 18:57:20 +08:00
|
|
|
|
|
|
|
</script>
|