github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix

pull/165/head
tjz 2018-02-08 21:58:43 +08:00
parent e888c64626
commit 75bf88dbe4
3 changed files with 40 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/trigger/Popup.vue
View File

@ -22,6 +22,7 @@ export default {
mask: PropTypes.bool, mask: PropTypes.bool,
zIndex: PropTypes.number, zIndex: PropTypes.number,
popupClassName: PropTypes.any, popupClassName: PropTypes.any,
popupStyle: PropTypes.object.def({}),
}, },
data () { data () {
return { return {
@ -99,7 +100,7 @@ export default {
}, },
getPopupElement () { getPopupElement () {
const { $props: props, $slots, $listeners, getTransitionName } = this const { $props: props, $slots, $listeners, getTransitionName } = this
const { align, visible, prefixCls, animation } = props const { align, visible, prefixCls, animation, popupStyle } = props
const { mouseenter, mouseleave } = $listeners const { mouseenter, mouseleave } = $listeners
const className = this.getClassName(props.getClassNameFromAlign(align)) const className = this.getClassName(props.getClassNameFromAlign(align))
// const hiddenClassName = `${prefixCls}-hidden` // const hiddenClassName = `${prefixCls}-hidden`
@ -115,7 +116,7 @@ export default {
mouseleave: mouseleave || noop, mouseleave: mouseleave || noop,
}, },
ref: 'popupInstance', ref: 'popupInstance',
style: { ...this.getZIndexStyle() }, style: { ...this.getZIndexStyle(), ...popupStyle },
} }
const transitionProps = { const transitionProps = {
props: Object.assign({ props: Object.assign({

4
components/trigger/index.vue
View File

@ -340,12 +340,12 @@ export default {
}, },
el: div, el: div,
render () { render () {
const { popupStyle, popupEvents, ...otherProps } = this.popupProps const { popupEvents, ...otherProps } = this.popupProps
const p = { const p = {
props: otherProps, props: otherProps,
on: popupEvents, on: popupEvents,
ref: 'popup', ref: 'popup',
style: popupStyle, // style: popupStyle,
} }
return ( return (
<Popup <Popup

65
components/vc-select/Select.vue
View File

@ -31,6 +31,7 @@ import {
} from './util' } from './util'
import SelectTrigger from './SelectTrigger' import SelectTrigger from './SelectTrigger'
import { SelectPropTypes } from './PropTypes' import { SelectPropTypes } from './PropTypes'
import { setTimeout } from 'timers'
function noop () {} function noop () {}
@ -101,7 +102,7 @@ export default {
} }
}, },
beforeMount () { beforeMount () {
this.adjustOpenState() // this.adjustOpenState()
}, },
mounted () { mounted () {
this.$nextTick(() => { this.$nextTick(() => {
@ -147,8 +148,8 @@ export default {
}) })
}, },
beforeUpdate () { beforeUpdate () {
console.log('beforeUpdate') // console.log('beforeUpdate')
this.adjustOpenState() // this.adjustOpenState()
}, },
beforeDestroy () { beforeDestroy () {
this.clearFocusTime() this.clearFocusTime()
@ -200,12 +201,12 @@ export default {
// combobox ignore // combobox ignore
onKeyDown (event) { onKeyDown (event) {
const { disabled, sOpen } = this const { disabled, openStatus } = this
if (disabled) { if (disabled) {
return return
} }
const keyCode = event.keyCode const keyCode = event.keyCode
if (sOpen && !this.getInputDOMNode()) { if (openStatus && !this.getInputDOMNode()) {
this.onInputKeydown(event) this.onInputKeydown(event)
} else if (keyCode === KeyCode.ENTER || keyCode === KeyCode.DOWN) { } else if (keyCode === KeyCode.ENTER || keyCode === KeyCode.DOWN) {
this.setOpenState(true) this.setOpenState(true)
@ -214,7 +215,7 @@ export default {
}, },
onInputKeydown (event) { onInputKeydown (event) {
const { disabled, sOpen, sValue, $props } = this const { disabled, openStatus, sValue, $props } = this
if (disabled) { if (disabled) {
return return
} }
@ -231,14 +232,14 @@ export default {
return return
} }
if (keyCode === KeyCode.DOWN) { if (keyCode === KeyCode.DOWN) {
if (!sOpen) { if (!openStatus) {
this.openIfHasChildren() this.openIfHasChildren()
event.preventDefault() event.preventDefault()
event.stopPropagation() event.stopPropagation()
return return
} }
} else if (keyCode === KeyCode.ESC) { } else if (keyCode === KeyCode.ESC) {
if (sOpen) { if (openStatus) {
this.setOpenState(false) this.setOpenState(false)
event.preventDefault() event.preventDefault()
event.stopPropagation() event.stopPropagation()
@ -246,7 +247,7 @@ export default {
return return
} }
if (sOpen) { if (openStatus) {
const menu = this.$refs.selectTriggerRef.getInnerMenu() const menu = this.$refs.selectTriggerRef.getInnerMenu()
if (menu && menu.onKeyDown(event, this.handleBackfill)) { if (menu && menu.onKeyDown(event, this.handleBackfill)) {
event.preventDefault() event.preventDefault()
@ -322,7 +323,7 @@ export default {
onArrowClick (e) { onArrowClick (e) {
// e.stopPropagation() // e.stopPropagation()
// if (!this.disabled) { // if (!this.disabled) {
// this.setOpenState(!this.sOpen, !this.sOpen) // this.setOpenState(!this.openStatus, !this.openStatus)
// } // }
}, },
@ -544,10 +545,13 @@ export default {
}, },
inputBlur (e) { inputBlur (e) {
// console.log(e.target) // console.log(e.target)
this.onOuterBlur() this.clearBlurTime()
if (!this.disabled) { this.blurTimer = setTimeout(() => {
this.setOpenState(!this.sOpen, !this.sOpen) this.onOuterBlur()
} if (!this.disabled) {
this.setOpenState(!this.openStatus, !this.openStatus)
}
}, 10)
}, },
_getInputElement () { _getInputElement () {
const props = this.$props const props = this.$props
@ -619,8 +623,8 @@ export default {
}, },
setOpenState (open, needFocus) { setOpenState (open, needFocus) {
const { $props: props, $data: state } = this const { $props: props, openStatus } = this
if (state.sOpen === open) { if (openStatus === open) {
this.maybeFocus(open, needFocus) this.maybeFocus(open, needFocus)
return return
} }
@ -919,7 +923,7 @@ export default {
const { $props, showSearch } = this const { $props, showSearch } = this
let options = [] let options = []
// If hidden menu due to no options, then it should be calculated again // If hidden menu due to no options, then it should be calculated again
if (sOpen || this.hiddenForNoOptions) { if (true || sOpen || this.hiddenForNoOptions) {
options = this.renderFilterOptions() options = this.renderFilterOptions()
} }
this._options = options this._options = options
@ -935,8 +939,9 @@ export default {
this.hiddenForNoOptions = false this.hiddenForNoOptions = false
} }
} }
this.openStatus = sOpen
return { return {
option: this._options, options,
open: sOpen, open: sOpen,
} }
}, },
@ -1095,8 +1100,8 @@ export default {
return sel return sel
}, },
renderTopControlNode () { renderTopControlNode (openStatus) {
const { sValue, sOpen, inputValue, $props: props } = this const { sValue, inputValue, $props: props } = this
const { const {
choiceTransitionName, choiceTransitionName,
prefixCls, prefixCls,
@ -1116,7 +1121,7 @@ export default {
if (!showSearch) { if (!showSearch) {
showSelectedValue = true showSelectedValue = true
} else { } else {
if (sOpen) { if (openStatus) {
showSelectedValue = !inputValue showSelectedValue = !inputValue
if (showSelectedValue) { if (showSelectedValue) {
opacity = 0.4 opacity = 0.4
@ -1149,7 +1154,7 @@ export default {
class={`${prefixCls}-search ${prefixCls}-search--inline`} class={`${prefixCls}-search ${prefixCls}-search--inline`}
key='input' key='input'
style={{ style={{
display: sOpen ? 'block' : 'none', display: openStatus ? 'block' : 'none',
}} }}
> >
{this._getInputElement()} {this._getInputElement()}
@ -1230,7 +1235,7 @@ export default {
if (isMultipleOrTags(props) && choiceTransitionName) { if (isMultipleOrTags(props) && choiceTransitionName) {
const transitionProps = getTransitionProps(choiceTransitionName, { const transitionProps = getTransitionProps(choiceTransitionName, {
tag: 'ul', tag: 'ul',
afterLeave: this.onChoiceAnimationLeave, // beforeEnter: this.onChoiceAnimationLeave,
}) })
innerNode = ( innerNode = (
<transition-group <transition-group
@ -1299,11 +1304,11 @@ export default {
render () { render () {
const props = this.$props const props = this.$props
const multiple = isMultipleOrTags(props) const multiple = isMultipleOrTags(props)
const { disabled, prefixCls, sOpen, inputValue, sValue, $listeners } = this const { options, open: openStatus } = this.getOptionsAndOpenStatus()
const { disabled, prefixCls, inputValue, sValue, $listeners } = this
const { mouseenter = noop, mouseleave = noop, popupScroll = noop } = $listeners const { mouseenter = noop, mouseleave = noop, popupScroll = noop } = $listeners
const ctrlNode = this.renderTopControlNode() const ctrlNode = this.renderTopControlNode(openStatus)
let extraSelectionProps = {} let extraSelectionProps = {}
const options = this._options
if (!isMultipleOrTagsOrCombobox(props)) { if (!isMultipleOrTagsOrCombobox(props)) {
extraSelectionProps = { extraSelectionProps = {
onKeyDown: this.onKeyDown, onKeyDown: this.onKeyDown,
@ -1312,8 +1317,8 @@ export default {
} }
const rootCls = { const rootCls = {
[prefixCls]: 1, [prefixCls]: 1,
[`${prefixCls}-open`]: sOpen, [`${prefixCls}-open`]: openStatus,
[`${prefixCls}-focused`]: sOpen || !!this._focused, [`${prefixCls}-focused`]: openStatus || !!this._focused,
[`${prefixCls}-combobox`]: isCombobox(props), [`${prefixCls}-combobox`]: isCombobox(props),
[`${prefixCls}-disabled`]: disabled, [`${prefixCls}-disabled`]: disabled,
[`${prefixCls}-enabled`]: !disabled, [`${prefixCls}-enabled`]: !disabled,
@ -1336,7 +1341,7 @@ export default {
options={options} options={options}
multiple={multiple} multiple={multiple}
disabled={disabled} disabled={disabled}
visible={sOpen} visible={openStatus}
inputValue={inputValue} inputValue={inputValue}
value={sValue} value={sValue}
firstActiveValue={props.firstActiveValue} firstActiveValue={props.firstActiveValue}
@ -1366,7 +1371,7 @@ export default {
role='combobox' role='combobox'
aria-autocomplete='list' aria-autocomplete='list'
aria-haspopup='true' aria-haspopup='true'
aria-expanded={sOpen} aria-expanded={openStatus}
{...extraSelectionProps} {...extraSelectionProps}
// onClick={this.stopPropagation} // onClick={this.stopPropagation}
> >