From 4e65ae0e0a62cb29d9116d7f715e1ddcc5aaba50 Mon Sep 17 00:00:00 2001 From: tanjinzhou <415800467@qq.com> Date: Sun, 19 Jan 2020 16:58:38 +0800 Subject: [PATCH] perf: update listeners --- build/config.js | 2 +- components/date-picker/RangePicker.jsx | 7 ++++--- components/date-picker/WeekPicker.jsx | 8 ++++---- components/date-picker/wrapPicker.js | 4 ++-- components/drawer/index.jsx | 4 ++-- components/dropdown/dropdown.jsx | 11 ++++++++--- components/empty/index.jsx | 4 ++-- components/form/Form.jsx | 5 ++--- components/grid/Col.jsx | 4 ++-- components/input-number/index.jsx | 4 ++-- components/input/Group.jsx | 5 ++--- components/input/Input.jsx | 9 ++++----- components/input/Password.jsx | 4 ++-- components/input/Search.jsx | 4 ++-- components/input/TextArea.jsx | 5 ++--- components/layout/layout.jsx | 12 ++++++------ components/list/Item.jsx | 14 ++++++++++---- components/list/index.jsx | 10 +++++++--- components/menu/MenuItem.jsx | 6 +++--- components/menu/index.jsx | 6 +++--- components/modal/Modal.jsx | 4 ++-- components/pagination/MiniSelect.jsx | 4 ++-- components/pagination/Pagination.jsx | 4 ++-- components/popover/index.jsx | 4 ++-- components/progress/progress.jsx | 4 ++-- components/radio/Group.jsx | 4 ++-- components/radio/Radio.jsx | 6 +++--- components/rate/index.jsx | 4 ++-- components/select/index.jsx | 3 ++- components/spin/Spin.jsx | 6 +++++- components/statistic/Countdown.jsx | 4 ++-- components/steps/index.jsx | 4 ++-- components/switch/index.jsx | 4 ++-- components/tag/Tag.jsx | 4 ++-- components/time-picker/index.jsx | 3 ++- components/timeline/Timeline.jsx | 3 ++- components/timeline/TimelineItem.jsx | 9 +++++++-- components/tooltip/Tooltip.jsx | 5 +++-- components/transfer/index.jsx | 3 ++- components/tree-select/index.jsx | 3 ++- components/tree/Tree.jsx | 3 ++- components/upload/Dragger.jsx | 4 ++-- components/upload/Upload.jsx | 1 - components/upload/UploadList.jsx | 4 ++-- components/vc-calendar/src/FullCalendar.jsx | 6 +++--- components/vc-calendar/src/RangeCalendar.jsx | 12 +++++++++--- .../vc-calendar/src/calendar/CalendarFooter.jsx | 5 ++--- .../vc-calendar/src/calendar/CalendarHeader.jsx | 4 ++-- components/vc-calendar/src/date/DateTBody.jsx | 5 ++--- components/vc-calendar/src/month/MonthPanel.jsx | 5 ++--- .../src/range-calendar/CalendarPart.jsx | 6 +++--- components/vc-calendar/src/year/YearPanel.jsx | 5 +++-- components/vc-cascader/Cascader.jsx | 9 ++++----- components/vc-checkbox/src/Checkbox.jsx | 10 ++++++++-- components/vc-dialog/DialogWrap.jsx | 6 +++--- components/vc-dialog/LazyRenderBox.jsx | 3 ++- components/vc-drawer/src/Drawer.js | 4 ++-- components/vc-form/src/createBaseForm.jsx | 12 +++++++++--- components/vc-input-number/src/InputHandler.js | 3 ++- components/vc-input-number/src/index.js | 4 ++-- components/vc-menu/DOMWrap.jsx | 4 ++-- components/vc-menu/Menu.jsx | 9 +++++++-- components/vc-menu/MenuItem.jsx | 4 ++-- components/vc-menu/MenuItemGroup.jsx | 4 ++-- components/vc-menu/SubMenu.jsx | 8 ++++---- components/vc-menu/SubPopupMenu.jsx | 3 ++- components/vc-notification/Notice.jsx | 14 +++----------- components/vc-select/DropdownMenu.jsx | 6 +++--- components/vc-select/Select.jsx | 6 +++--- components/vc-select/SelectTrigger.jsx | 7 ++++--- components/vc-slick/src/inner-slider.js | 4 ++-- components/vc-slick/src/slider.js | 6 ++---- components/vc-slider/src/Handle.jsx | 4 ++-- components/vc-steps/Step.jsx | 4 ++-- components/vc-steps/Steps.jsx | 4 ++-- components/vc-switch/Switch.jsx | 4 ++-- components/vc-tabs/src/ScrollableInkTabBar.jsx | 3 ++- components/vc-tabs/src/TabBar.jsx | 4 ++-- components/vc-tabs/src/Tabs.jsx | 4 ++-- components/vc-time-picker/Panel.jsx | 5 ++--- .../vc-tree-select/src/Base/BaseSelector.jsx | 5 ++--- .../vc-tree-select/src/Popup/SinglePopup.jsx | 5 +++-- components/vc-tree-select/src/Select.jsx | 5 +++-- .../src/Selector/MultipleSelector/Selection.jsx | 5 ++--- .../vc-tree-select/src/Selector/SingleSelector.jsx | 4 ++-- components/vc-trigger/PopupInner.jsx | 4 ++-- components/vc-trigger/Trigger.jsx | 6 +++--- components/vc-upload/src/AjaxUploader.jsx | 3 ++- components/vc-upload/src/Upload.jsx | 4 ++-- 89 files changed, 257 insertions(+), 215 deletions(-) diff --git a/build/config.js b/build/config.js index 74c41ddf5..56e7d12c6 100644 --- a/build/config.js +++ b/build/config.js @@ -1,3 +1,3 @@ module.exports = { - devComponent: 'table', + devComponent: 'menu', }; diff --git a/components/date-picker/RangePicker.jsx b/components/date-picker/RangePicker.jsx index 97c6f496c..17c881388 100644 --- a/components/date-picker/RangePicker.jsx +++ b/components/date-picker/RangePicker.jsx @@ -15,6 +15,7 @@ import { mergeProps, getComponentFromProp, isValidElement, + getListeners, } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import { cloneElement } from '../_util/vnode'; @@ -262,16 +263,16 @@ export default { sShowDate: showDate, sHoverValue: hoverValue, sOpen: open, - $listeners, $scopedSlots, } = this; + const listeners = getListeners(this); const { calendarChange = noop, ok = noop, focus = noop, blur = noop, panelChange = noop, - } = $listeners; + } = listeners; const { prefixCls: customizePrefixCls, tagPrefixCls: customizeTagPrefixCls, @@ -407,7 +408,7 @@ export default { const vcDatePickerProps = mergeProps( { props, - on: $listeners, + on: listeners, }, pickerChangeHandler, { diff --git a/components/date-picker/WeekPicker.jsx b/components/date-picker/WeekPicker.jsx index 22c890dd3..2a41174a8 100644 --- a/components/date-picker/WeekPicker.jsx +++ b/components/date-picker/WeekPicker.jsx @@ -9,6 +9,7 @@ import { initDefaultProps, getComponentFromProp, isValidElement, + getListeners, } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import { WeekPickerProps } from './interface'; @@ -149,16 +150,15 @@ export default { localeCode, disabledDate, $data, - $listeners, $scopedSlots, } = this; - + const listeners = getListeners(this); const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('calendar', customizePrefixCls); this._prefixCls = prefixCls; const { _value: pickerValue, _open: open } = $data; - const { focus = noop, blur = noop } = $listeners; + const { focus = noop, blur = noop } = listeners; if (pickerValue && localeCode) { pickerValue.locale(localeCode); @@ -225,7 +225,7 @@ export default { open, }, on: { - ...$listeners, + ...listeners, change: this.handleChange, openChange: this.handleOpenChange, }, diff --git a/components/date-picker/wrapPicker.js b/components/date-picker/wrapPicker.js index 06698f853..e81988410 100644 --- a/components/date-picker/wrapPicker.js +++ b/components/date-picker/wrapPicker.js @@ -3,7 +3,7 @@ import classNames from 'classnames'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; import { generateShowHourMinuteSecond } from '../time-picker'; import enUS from './locale/en_US'; -import { getOptionProps, initDefaultProps } from '../_util/props-util'; +import { getOptionProps, initDefaultProps, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; const DEFAULT_FORMAT = { @@ -168,7 +168,7 @@ export default function wrapPicker(Picker, props, pickerType) { timePicker, }, on: { - ...this.$listeners, + ...getListeners(this), openChange: this.handleOpenChange, focus: this.handleFocus, blur: this.handleBlur, diff --git a/components/drawer/index.jsx b/components/drawer/index.jsx index 31084c00c..80277b7b5 100644 --- a/components/drawer/index.jsx +++ b/components/drawer/index.jsx @@ -3,7 +3,7 @@ import VcDrawer from '../vc-drawer/src'; import PropTypes from '../_util/vue-types'; import BaseMixin from '../_util/BaseMixin'; import Icon from '../icon'; -import { getComponentFromProp, getOptionProps } from '../_util/props-util'; +import { getComponentFromProp, getOptionProps, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Base from '../base'; @@ -214,7 +214,7 @@ const Drawer = { }, on: { maskClick: this.onMaskClick, - ...this.$listeners, + ...getListeners(this), }, }; return {this.renderBody(prefixCls)}; diff --git a/components/dropdown/dropdown.jsx b/components/dropdown/dropdown.jsx index 613fb6876..006636449 100644 --- a/components/dropdown/dropdown.jsx +++ b/components/dropdown/dropdown.jsx @@ -2,7 +2,12 @@ import RcDropdown from '../vc-dropdown/src/index'; import DropdownButton from './dropdown-button'; import PropTypes from '../_util/vue-types'; import { cloneElement } from '../_util/vnode'; -import { getOptionProps, getPropsData, getComponentFromProp } from '../_util/props-util'; +import { + getOptionProps, + getPropsData, + getComponentFromProp, + getListeners, +} from '../_util/props-util'; import getDropdownProps from './getDropdownProps'; import { ConfigConsumerProps } from '../config-provider'; import Icon from '../icon'; @@ -72,7 +77,7 @@ const Dropdown = { }, render() { - const { $slots, $listeners } = this; + const { $slots } = this; const props = getOptionProps(this); const { prefixCls: customizePrefixCls, trigger, disabled, getPopupContainer } = props; const { getPopupContainer: getContextPopupContainer } = this.configProvider; @@ -99,7 +104,7 @@ const Dropdown = { transitionName: this.getTransitionName(), trigger: triggerActions, }, - on: $listeners, + on: getListeners(this), }; return ( diff --git a/components/empty/index.jsx b/components/empty/index.jsx index 5b1022cd6..1e0f97196 100644 --- a/components/empty/index.jsx +++ b/components/empty/index.jsx @@ -1,6 +1,6 @@ import PropTypes from '../_util/vue-types'; import { ConfigConsumerProps } from '../config-provider'; -import { getComponentFromProp } from '../_util/props-util'; +import { getComponentFromProp, getListeners } from '../_util/props-util'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; import emptyImg from './empty.svg'; import Base from '../base'; @@ -43,7 +43,7 @@ const Empty = { imageNode = image; } return ( -
+
{imageNode}

{des}

{this.$slots.default &&
{this.$slots.default}
} diff --git a/components/form/Form.jsx b/components/form/Form.jsx index 95c98c971..88fe5934a 100755 --- a/components/form/Form.jsx +++ b/components/form/Form.jsx @@ -8,7 +8,7 @@ import createDOMForm from '../vc-form/src/createDOMForm'; import createFormField from '../vc-form/src/createFormField'; import FormItem from './FormItem'; import { FIELD_META_PROP, FIELD_DATA_PROP } from './constants'; -import { initDefaultProps } from '../_util/props-util'; +import { initDefaultProps, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Base from '../base'; @@ -192,8 +192,7 @@ const Form = { }, methods: { onSubmit(e) { - const { $listeners } = this; - if (!$listeners.submit) { + if (!getListeners(this).submit) { e.preventDefault(); } else { this.$emit('submit', e); diff --git a/components/grid/Col.jsx b/components/grid/Col.jsx index 9e54de797..0f9b125d3 100644 --- a/components/grid/Col.jsx +++ b/components/grid/Col.jsx @@ -1,5 +1,6 @@ import PropTypes from '../_util/vue-types'; import { ConfigConsumerProps } from '../config-provider'; +import { getListeners } from '../_util/props-util'; const stringOrNumber = PropTypes.oneOfType([PropTypes.string, PropTypes.number]); @@ -46,7 +47,6 @@ export default { pull, prefixCls: customizePrefixCls, $slots, - $listeners, rowContext, } = this; const getPrefixCls = this.configProvider.getPrefixCls; @@ -80,7 +80,7 @@ export default { ...sizeClassObj, }; const divProps = { - on: $listeners, + on: getListeners(this), class: classes, style: {}, }; diff --git a/components/input-number/index.jsx b/components/input-number/index.jsx index 577a98d14..3b12358a3 100644 --- a/components/input-number/index.jsx +++ b/components/input-number/index.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { initDefaultProps, getOptionProps } from '../_util/props-util'; +import { initDefaultProps, getOptionProps, getListeners } from '../_util/props-util'; import classNames from 'classnames'; import Icon from '../icon'; import VcInputNumber from '../vc-input-number/src'; @@ -68,7 +68,7 @@ const InputNumber = { }, class: inputNumberClass, ref: 'inputNumberRef', - on: this.$listeners, + on: getListeners(this), }; return ; }, diff --git a/components/input/Group.jsx b/components/input/Group.jsx index 3e35c3ece..e89cd578b 100644 --- a/components/input/Group.jsx +++ b/components/input/Group.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { filterEmpty } from '../_util/props-util'; +import { filterEmpty, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; export default { @@ -32,9 +32,8 @@ export default { }, methods: {}, render() { - const { $listeners } = this; return ( - + {filterEmpty(this.$slots.default)} ); diff --git a/components/input/Input.jsx b/components/input/Input.jsx index 37cf31e13..1e3a352eb 100644 --- a/components/input/Input.jsx +++ b/components/input/Input.jsx @@ -2,7 +2,7 @@ import classNames from 'classnames'; import TextArea from './TextArea'; import omit from 'omit.js'; import inputProps from './inputProps'; -import { hasProp, getComponentFromProp } from '../_util/props-util'; +import { hasProp, getComponentFromProp, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Icon from '../icon'; @@ -234,7 +234,7 @@ export default { 'defaultValue', 'lazy', ]); - const { stateValue, getInputClassName, handleKeyDown, handleChange, $listeners } = this; + const { stateValue, getInputClassName, handleKeyDown, handleChange } = this; const inputProps = { directives: [{ name: 'ant-input' }], domProps: { @@ -242,7 +242,7 @@ export default { }, attrs: { ...otherProps, ...this.$attrs }, on: { - ...$listeners, + ...getListeners(this), keydown: handleKeyDown, input: handleChange, change: noop, @@ -256,12 +256,11 @@ export default { }, render() { if (this.$props.type === 'textarea') { - const { $listeners } = this; const textareaProps = { props: this.$props, attrs: this.$attrs, on: { - ...$listeners, + ...getListeners(this), input: this.handleChange, keydown: this.handleKeyDown, change: noop, diff --git a/components/input/Password.jsx b/components/input/Password.jsx index 4e610a7c1..2065474ff 100644 --- a/components/input/Password.jsx +++ b/components/input/Password.jsx @@ -1,5 +1,5 @@ import classNames from 'classnames'; -import { getComponentFromProp, getOptionProps } from '../_util/props-util'; +import { getComponentFromProp, getOptionProps, getListeners } from '../_util/props-util'; import Input from './Input'; import Icon from '../icon'; import inputProps from './inputProps'; @@ -93,7 +93,7 @@ export default { }, class: inputClassName, ref: 'input', - on: this.$listeners, + on: getListeners(this), }; return ; }, diff --git a/components/input/Search.jsx b/components/input/Search.jsx index 61cfba918..2e0a88770 100644 --- a/components/input/Search.jsx +++ b/components/input/Search.jsx @@ -4,7 +4,7 @@ import Icon from '../icon'; import inputProps from './inputProps'; import Button from '../button'; import { cloneElement } from '../_util/vnode'; -import { getOptionProps, getComponentFromProp, isValidElement } from '../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; import PropTypes from '../_util/vue-types'; import { ConfigConsumerProps } from '../config-provider'; @@ -119,7 +119,7 @@ export default { inputClassName = prefixCls; } - const on = { ...this.$listeners }; + const on = { ...getListeners(this) }; delete on.search; const inputProps = { props: { diff --git a/components/input/TextArea.jsx b/components/input/TextArea.jsx index 3e86c138d..ee5aca4a6 100644 --- a/components/input/TextArea.jsx +++ b/components/input/TextArea.jsx @@ -3,7 +3,7 @@ import omit from 'omit.js'; import ResizeObserver from 'resize-observer-polyfill'; import inputProps from './inputProps'; import calculateNodeHeight from './calculateNodeHeight'; -import hasProp from '../_util/props-util'; +import hasProp, { getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; function onNextFrame(cb) { @@ -146,7 +146,6 @@ export default { handleTextareaChange, textareaStyles, $attrs, - $listeners, prefixCls: customizePrefixCls, disabled, } = this; @@ -169,7 +168,7 @@ export default { directives: [{ name: 'ant-input' }], attrs: { ...otherProps, ...$attrs }, on: { - ...$listeners, + ...getListeners(this), keydown: handleKeyDown, input: handleTextareaChange, change: noop, diff --git a/components/layout/layout.jsx b/components/layout/layout.jsx index 217ab4171..4caa9755b 100644 --- a/components/layout/layout.jsx +++ b/components/layout/layout.jsx @@ -1,6 +1,6 @@ import PropTypes from '../_util/vue-types'; import classNames from 'classnames'; -import { getOptionProps } from '../_util/props-util'; +import { getOptionProps, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; export const BasicProps = { @@ -27,7 +27,7 @@ function generator(props, name) { prefixCls, ...getOptionProps(this), }, - on: this.$listeners, + on: getListeners(this), }; return {this.$slots.default}; }, @@ -38,10 +38,10 @@ function generator(props, name) { const Basic = { props: BasicProps, render() { - const { prefixCls, $slots, $listeners } = this; + const { prefixCls, $slots } = this; const divProps = { class: prefixCls, - on: $listeners, + on: getListeners(this), }; return
{$slots.default}
; }, @@ -67,13 +67,13 @@ const BasicLayout = { }; }, render() { - const { prefixCls, $slots, hasSider, $listeners } = this; + const { prefixCls, $slots, hasSider } = this; const divCls = classNames(prefixCls, { [`${prefixCls}-has-sider`]: hasSider || this.siders.length > 0, }); const divProps = { class: divCls, - on: $listeners, + on: getListeners, }; return
{$slots.default}
; }, diff --git a/components/list/Item.jsx b/components/list/Item.jsx index d390397ed..65de8fb3d 100644 --- a/components/list/Item.jsx +++ b/components/list/Item.jsx @@ -1,6 +1,11 @@ import PropTypes from '../_util/vue-types'; import classNames from 'classnames'; -import { getSlotOptions, getComponentFromProp, isEmptyElement } from '../_util/props-util'; +import { + getSlotOptions, + getComponentFromProp, + isEmptyElement, + getListeners, +} from '../_util/props-util'; import { Col } from '../grid'; import { ConfigConsumerProps } from '../config-provider'; import { ListGridType } from './index'; @@ -65,7 +70,8 @@ export default { }, render() { const { grid } = this.listContext; - const { prefixCls: customizePrefixCls, $slots, $listeners } = this; + const { prefixCls: customizePrefixCls, $slots } = this; + const listeners = getListeners(this); const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('list', customizePrefixCls); @@ -127,7 +133,7 @@ export default { xl={getGrid(grid, 'xl')} xxl={getGrid(grid, 'xxl')} > -
+
{extra && extraContent} {!extra && metaContent} {!extra && content} @@ -135,7 +141,7 @@ export default {
) : ( -
+
{extra && extraContent} {!extra && metaContent} {!extra && content} diff --git a/components/list/index.jsx b/components/list/index.jsx index a205e0481..9740572cf 100644 --- a/components/list/index.jsx +++ b/components/list/index.jsx @@ -8,7 +8,12 @@ import Pagination, { PaginationConfig } from '../pagination'; import { Row } from '../grid'; import Item from './Item'; -import { initDefaultProps, getComponentFromProp, filterEmpty } from '../_util/props-util'; +import { + initDefaultProps, + getComponentFromProp, + filterEmpty, + getListeners, +} from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; import Base from '../base'; @@ -136,7 +141,6 @@ const List = { dataSource, size, loading, - $listeners, $slots, paginationCurrent, } = this; @@ -229,7 +233,7 @@ const List = { const paginationPosition = paginationProps.position || 'bottom'; return ( -
+
{(paginationPosition === 'top' || paginationPosition === 'both') && paginationContent} {header &&
{header}
} diff --git a/components/menu/MenuItem.jsx b/components/menu/MenuItem.jsx index 860b5a436..bf06b726c 100644 --- a/components/menu/MenuItem.jsx +++ b/components/menu/MenuItem.jsx @@ -1,5 +1,5 @@ import { Item, itemProps } from '../vc-menu'; -import { getOptionProps } from '../_util/props-util'; +import { getOptionProps, getListeners } from '../_util/props-util'; import Tooltip from '../tooltip'; function noop() {} export default { @@ -18,7 +18,7 @@ export default { render() { const props = getOptionProps(this); const { level, title, rootPrefixCls } = props; - const { getInlineCollapsed, $slots, $attrs: attrs, $listeners } = this; + const { getInlineCollapsed, $slots, $attrs: attrs } = this; const inlineCollapsed = getInlineCollapsed(); let titleNode; if (inlineCollapsed) { @@ -31,7 +31,7 @@ export default { title: inlineCollapsed ? null : title, }, attrs, - on: $listeners, + on: getListeners(this), }; const toolTipProps = { props: { diff --git a/components/menu/index.jsx b/components/menu/index.jsx index 49dc5a76a..ec5c9ccb3 100644 --- a/components/menu/index.jsx +++ b/components/menu/index.jsx @@ -4,7 +4,7 @@ import PropTypes from '../_util/vue-types'; import animation from '../_util/openAnimation'; import warning from '../_util/warning'; import Item from './MenuItem'; -import { hasProp } from '../_util/props-util'; +import { hasProp, getListeners } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import commonPropsType from '../vc-menu/commonPropsType'; import { ConfigConsumerProps } from '../config-provider'; @@ -205,7 +205,7 @@ const Menu = { }, }, render() { - const { layoutSiderContext, $slots, $listeners } = this; + const { layoutSiderContext, $slots } = this; const { collapsedWidth } = layoutSiderContext; const { getPopupContainer: getContextPopupContainer } = this.configProvider; const { prefixCls: customizePrefixCls, theme, getPopupContainer } = this.$props; @@ -228,7 +228,7 @@ const Menu = { prefixCls, }, on: { - ...$listeners, + ...getListeners(this), select: this.handleSelect, deselect: this.handleDeselect, openChange: this.handleOpenChange, diff --git a/components/modal/Modal.jsx b/components/modal/Modal.jsx index 89e65415c..b4d425464 100644 --- a/components/modal/Modal.jsx +++ b/components/modal/Modal.jsx @@ -14,6 +14,7 @@ import { getClass, getStyle, mergeProps, + getListeners, } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; @@ -160,7 +161,6 @@ export default { visible, wrapClassName, centered, - $listeners, $slots, $attrs, } = this; @@ -194,7 +194,7 @@ export default { closeIcon, }, on: { - ...$listeners, + ...getListeners(this), close: this.handleCancel, }, class: getClass(this), diff --git a/components/pagination/MiniSelect.jsx b/components/pagination/MiniSelect.jsx index 9c945549f..568768719 100644 --- a/components/pagination/MiniSelect.jsx +++ b/components/pagination/MiniSelect.jsx @@ -1,5 +1,5 @@ import VcSelect, { SelectProps } from '../select'; -import { getOptionProps, filterEmpty } from '../_util/props-util'; +import { getOptionProps, filterEmpty, getListeners } from '../_util/props-util'; export default { props: { @@ -13,7 +13,7 @@ export default { ...selectOptionsProps, size: 'small', }, - on: this.$listeners, + on: getListeners(this), }; return {filterEmpty(this.$slots.default)}; }, diff --git a/components/pagination/Pagination.jsx b/components/pagination/Pagination.jsx index 8935c0f69..c3fbd049a 100644 --- a/components/pagination/Pagination.jsx +++ b/components/pagination/Pagination.jsx @@ -2,7 +2,7 @@ import PropTypes from '../_util/vue-types'; import VcSelect from '../select'; import MiniSelect from './MiniSelect'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; -import { getOptionProps } from '../_util/props-util'; +import { getOptionProps, getListeners } from '../_util/props-util'; import VcPagination from '../vc-pagination'; import enUS from '../vc-pagination/locale/en_US'; import Icon from '../icon'; @@ -111,7 +111,7 @@ export default { class: { mini: isSmall, }, - on: this.$listeners, + on: getListeners(this), }; return ; diff --git a/components/popover/index.jsx b/components/popover/index.jsx index 336c6d040..719db4bdb 100644 --- a/components/popover/index.jsx +++ b/components/popover/index.jsx @@ -1,7 +1,7 @@ import Tooltip from '../tooltip'; import abstractTooltipProps from '../tooltip/abstractTooltipProps'; import PropTypes from '../_util/vue-types'; -import { getOptionProps, getComponentFromProp } from '../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Base from '../base'; @@ -42,7 +42,7 @@ const Popover = { prefixCls, }, ref: 'tooltip', - on: this.$listeners, + on: getListeners(this), }; return ( diff --git a/components/progress/progress.jsx b/components/progress/progress.jsx index 8cad781bb..f6aca2f0e 100644 --- a/components/progress/progress.jsx +++ b/components/progress/progress.jsx @@ -1,6 +1,6 @@ import classNames from 'classnames'; import PropTypes from '../_util/vue-types'; -import { getOptionProps, initDefaultProps } from '../_util/props-util'; +import { getOptionProps, initDefaultProps, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Icon from '../icon'; import Line from './line'; @@ -136,7 +136,7 @@ export default { props: { ...restProps, }, - on: this.$listeners, + on: getListeners(this), class: classString, }; return
{progress}
; diff --git a/components/radio/Group.jsx b/components/radio/Group.jsx index db13ce7f1..f334af5cb 100644 --- a/components/radio/Group.jsx +++ b/components/radio/Group.jsx @@ -1,7 +1,7 @@ import classNames from 'classnames'; import PropTypes from '../_util/vue-types'; import Radio from './Radio'; -import { getOptionProps, filterEmpty, hasProp } from '../_util/props-util'; +import { getOptionProps, filterEmpty, hasProp, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; function noop() {} @@ -85,7 +85,7 @@ export default { }, }, render() { - const { mouseenter = noop, mouseleave = noop } = this.$listeners; + const { mouseenter = noop, mouseleave = noop } = getListeners(this); const props = getOptionProps(this); const { prefixCls: customizePrefixCls, options, buttonStyle } = props; const getPrefixCls = this.configProvider.getPrefixCls; diff --git a/components/radio/Radio.jsx b/components/radio/Radio.jsx index b8d8e838c..d12fbf668 100644 --- a/components/radio/Radio.jsx +++ b/components/radio/Radio.jsx @@ -1,7 +1,7 @@ import PropTypes from '../_util/vue-types'; import VcCheckbox from '../vc-checkbox'; import classNames from 'classnames'; -import { getOptionProps, getAttrs } from '../_util/props-util'; +import { getOptionProps, getAttrs, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; function noop() {} @@ -48,10 +48,10 @@ export default { }, render() { - const { $slots, $listeners, radioGroupContext: radioGroup } = this; + const { $slots, radioGroupContext: radioGroup } = this; const props = getOptionProps(this); const children = $slots.default; - const { mouseenter = noop, mouseleave = noop, ...restListeners } = $listeners; + const { mouseenter = noop, mouseleave = noop, ...restListeners } = getListeners(this); const { prefixCls: customizePrefixCls, ...restProps } = props; const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('radio', customizePrefixCls); diff --git a/components/rate/index.jsx b/components/rate/index.jsx index 006acf993..f92c14239 100644 --- a/components/rate/index.jsx +++ b/components/rate/index.jsx @@ -1,6 +1,6 @@ import omit from 'omit.js'; import PropTypes from '../_util/vue-types'; -import { getOptionProps, getComponentFromProp } from '../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import VcRate from '../vc-rate'; import Icon from '../icon'; @@ -58,7 +58,7 @@ const Rate = { prefixCls, ...omit(restProps, ['tooltips']), }, - on: this.$listeners, + on: getListeners(this), ref: 'refRate', }; return ; diff --git a/components/select/index.jsx b/components/select/index.jsx index 81088c6ee..80d492a63 100644 --- a/components/select/index.jsx +++ b/components/select/index.jsx @@ -8,6 +8,7 @@ import { getOptionProps, filterEmpty, isValidElement, + getListeners, } from '../_util/props-util'; import Icon from '../icon'; import { cloneElement } from '../_util/vnode'; @@ -254,7 +255,7 @@ const Select = { dropdownRender: getComponentFromProp(this, 'dropdownRender', {}, false), getPopupContainer: getPopupContainer || getContextPopupContainer, }, - on: this.$listeners, + on: getListeners(this), class: cls, ref: 'vcSelect', }; diff --git a/components/spin/Spin.jsx b/components/spin/Spin.jsx index c4f095d70..bbd1e9f9f 100644 --- a/components/spin/Spin.jsx +++ b/components/spin/Spin.jsx @@ -6,6 +6,7 @@ import { initDefaultProps, isValidElement, getComponentFromProp, + getListeners, } from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; import { ConfigConsumerProps } from '../config-provider'; @@ -151,7 +152,10 @@ export default { }; return ( -
+
{sSpinning &&
{spinElement}
}
{children} diff --git a/components/statistic/Countdown.jsx b/components/statistic/Countdown.jsx index 97dc20101..98d7793d2 100644 --- a/components/statistic/Countdown.jsx +++ b/components/statistic/Countdown.jsx @@ -1,7 +1,7 @@ import * as moment from 'moment'; import interopDefault from '../_util/interopDefault'; import { cloneElement } from '../_util/vnode'; -import { initDefaultProps } from '../_util/props-util'; +import { initDefaultProps, getListeners } from '../_util/props-util'; import Statistic, { StatisticProps } from './Statistic'; import { formatCountdown } from './utils'; @@ -88,7 +88,7 @@ export default { valueRender: this.valueRenderHtml, formatter: this.formatCountdown, }, - on: this.$listeners, + on: getListeners(this), }} /> ); diff --git a/components/steps/index.jsx b/components/steps/index.jsx index c1e33a387..ada929c55 100644 --- a/components/steps/index.jsx +++ b/components/steps/index.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { initDefaultProps, getOptionProps } from '../_util/props-util'; +import { initDefaultProps, getOptionProps, getListeners } from '../_util/props-util'; import VcSteps from '../vc-steps'; import Icon from '../icon'; import { ConfigConsumerProps } from '../config-provider'; @@ -47,7 +47,7 @@ const Steps = { prefixCls, ...props, }, - on: this.$listeners, + on: getListeners(this), scopedSlots: this.$scopedSlots, }; return {this.$slots.default}; diff --git a/components/switch/index.jsx b/components/switch/index.jsx index 465011e93..8fd9db16c 100644 --- a/components/switch/index.jsx +++ b/components/switch/index.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { getOptionProps, getComponentFromProp } from '../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; import VcSwitch from '../vc-switch'; import Wave from '../_util/wave'; import Icon from '../icon'; @@ -60,7 +60,7 @@ const Switch = { unCheckedChildren: getComponentFromProp(this, 'unCheckedChildren'), disabled: disabled || loading, }, - on: this.$listeners, + on: getListeners(this), class: classes, ref: 'refSwitchNode', }; diff --git a/components/tag/Tag.jsx b/components/tag/Tag.jsx index a734e4c87..cd4dbda50 100644 --- a/components/tag/Tag.jsx +++ b/components/tag/Tag.jsx @@ -3,7 +3,7 @@ import Icon from '../icon'; import getTransitionProps from '../_util/getTransitionProps'; import omit from 'omit.js'; import Wave from '../_util/wave'; -import { hasProp } from '../_util/props-util'; +import { hasProp, getListeners } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import { ConfigConsumerProps } from '../config-provider'; @@ -103,7 +103,7 @@ export default { const tag = (
diff --git a/components/time-picker/index.jsx b/components/time-picker/index.jsx index c49fd5b28..e29ff757f 100644 --- a/components/time-picker/index.jsx +++ b/components/time-picker/index.jsx @@ -14,6 +14,7 @@ import { getOptionProps, getComponentFromProp, isValidElement, + getListeners, } from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; import { ConfigConsumerProps } from '../config-provider'; @@ -220,7 +221,7 @@ const TimePicker = { class: pickerClassName, ref: 'timePicker', on: { - ...this.$listeners, + ...getListeners(this), change: this.handleChange, open: this.handleOpenClose, close: this.handleOpenClose, diff --git a/components/timeline/Timeline.jsx b/components/timeline/Timeline.jsx index a37a90f3b..d094b8eb2 100644 --- a/components/timeline/Timeline.jsx +++ b/components/timeline/Timeline.jsx @@ -5,6 +5,7 @@ import { initDefaultProps, filterEmpty, getComponentFromProp, + getListeners, } from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; import TimelineItem from './TimelineItem'; @@ -92,7 +93,7 @@ export default { ...restProps, }, class: classString, - on: this.$listeners, + on: getListeners(this), }; return
    {items}
; }, diff --git a/components/timeline/TimelineItem.jsx b/components/timeline/TimelineItem.jsx index 5f14b4290..3957bc29c 100644 --- a/components/timeline/TimelineItem.jsx +++ b/components/timeline/TimelineItem.jsx @@ -1,6 +1,11 @@ import classNames from 'classnames'; import PropTypes from '../_util/vue-types'; -import { getOptionProps, initDefaultProps, getComponentFromProp } from '../_util/props-util'; +import { + getOptionProps, + initDefaultProps, + getComponentFromProp, + getListeners, +} from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; export const TimeLineItemProps = { @@ -37,7 +42,7 @@ export default { }); const liProps = { class: itemClassName, - on: this.$listeners, + on: getListeners(this), }; return (
  • diff --git a/components/tooltip/Tooltip.jsx b/components/tooltip/Tooltip.jsx index cdd076eed..dcf427622 100644 --- a/components/tooltip/Tooltip.jsx +++ b/components/tooltip/Tooltip.jsx @@ -8,6 +8,7 @@ import { getClass, getStyle, isValidElement, + getListeners, } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import abstractTooltipProps from './abstractTooltipProps'; @@ -161,7 +162,7 @@ export default { }, render() { - const { $props, $data, $slots, $listeners } = this; + const { $props, $data, $slots } = this; const { prefixCls: customizePrefixCls, openClassName, getPopupContainer } = $props; const { getPopupContainer: getContextPopupContainer } = this.configProvider; const getPrefixCls = this.configProvider.getPrefixCls; @@ -192,7 +193,7 @@ export default { }, ref: 'tooltip', on: { - ...$listeners, + ...getListeners(this), visibleChange: this.onVisibleChange, popupAlign: this.onPopupAlign, }, diff --git a/components/transfer/index.jsx b/components/transfer/index.jsx index 2250f1904..6e382ad5f 100644 --- a/components/transfer/index.jsx +++ b/components/transfer/index.jsx @@ -4,6 +4,7 @@ import { initDefaultProps, getOptionProps, getComponentFromProp, + getListeners, } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; import classNames from 'classnames'; @@ -240,7 +241,7 @@ const Transfer = { // add filter [`${direction}Filter`]: value, }); - if (this.$listeners.searchChange) { + if (getListeners(this).searchChange) { warning(false, '`searchChange` in Transfer is deprecated. Please use `search` instead.'); this.$emit('searchChange', direction, e); } diff --git a/components/tree-select/index.jsx b/components/tree-select/index.jsx index 14665c488..f3235d7e4 100644 --- a/components/tree-select/index.jsx +++ b/components/tree-select/index.jsx @@ -8,6 +8,7 @@ import { getComponentFromProp, filterEmpty, isValidElement, + getListeners, } from '../_util/props-util'; import { ConfigConsumerProps } from '../config-provider'; import Base from '../base'; @@ -152,7 +153,7 @@ const TreeSelect = { treeData ? { treeData } : {}, ), class: cls, - on: { ...this.$listeners, change: this.onChange }, + on: { ...getListeners(this), change: this.onChange }, ref: 'vcTreeSelect', scopedSlots: this.$scopedSlots, }; diff --git a/components/tree/Tree.jsx b/components/tree/Tree.jsx index 37291922b..485730d0d 100644 --- a/components/tree/Tree.jsx +++ b/components/tree/Tree.jsx @@ -8,6 +8,7 @@ import { filterEmpty, getComponentFromProp, getClass, + getListeners, } from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; import { ConfigConsumerProps } from '../config-provider'; @@ -205,7 +206,7 @@ export default { __propsSymbol__: Symbol(), switcherIcon: nodeProps => this.renderSwitcherIcon(prefixCls, switcherIcon, nodeProps), }, - on: this.$listeners, + on: getListeners(this), ref: 'tree', class: !showIcon && `${prefixCls}-icon-hide`, }; diff --git a/components/upload/Dragger.jsx b/components/upload/Dragger.jsx index b1b65cfb0..291e12152 100644 --- a/components/upload/Dragger.jsx +++ b/components/upload/Dragger.jsx @@ -1,4 +1,4 @@ -import { getOptionProps } from '../_util/props-util'; +import { getOptionProps, getListeners } from '../_util/props-util'; import Upload from './Upload'; import { UploadProps } from './interface'; @@ -12,7 +12,7 @@ export default { ...props, type: 'drag', }, - on: this.$listeners, + on: getListeners(this), style: { height: this.height }, }; return {this.$slots.default}; diff --git a/components/upload/Upload.jsx b/components/upload/Upload.jsx index 380c06b0c..e5bc1005b 100644 --- a/components/upload/Upload.jsx +++ b/components/upload/Upload.jsx @@ -238,7 +238,6 @@ export default { beforeUpload: this.reBeforeUpload, }, on: { - // ...this.$listeners, start: this.onStart, error: this.onError, progress: this.onProgress, diff --git a/components/upload/UploadList.jsx b/components/upload/UploadList.jsx index 2ecb63611..43bc727d8 100644 --- a/components/upload/UploadList.jsx +++ b/components/upload/UploadList.jsx @@ -1,5 +1,5 @@ import BaseMixin from '../_util/BaseMixin'; -import { getOptionProps, initDefaultProps } from '../_util/props-util'; +import { getOptionProps, initDefaultProps, getListeners } from '../_util/props-util'; import getTransitionProps from '../_util/getTransitionProps'; import { ConfigConsumerProps } from '../config-provider'; import Icon from '../icon'; @@ -95,7 +95,7 @@ export default { this.$emit('remove', file); }, handlePreview(file, e) { - const { preview } = this.$listeners; + const { preview } = getListeners(this); if (!preview) { return; } diff --git a/components/vc-calendar/src/FullCalendar.jsx b/components/vc-calendar/src/FullCalendar.jsx index a846823d5..2743d146b 100644 --- a/components/vc-calendar/src/FullCalendar.jsx +++ b/components/vc-calendar/src/FullCalendar.jsx @@ -1,7 +1,7 @@ import moment from 'moment'; import PropTypes from '../../_util/vue-types'; import BaseMixin from '../../_util/BaseMixin'; -import { getOptionProps, hasProp } from '../../_util/props-util'; +import { getOptionProps, hasProp, getListeners } from '../../_util/props-util'; import DateTable from './date/DateTable'; import MonthTable from './month/MonthTable'; import CalendarMixin, { getNowByCurrentStateValue } from './mixin/CalendarMixin'; @@ -93,7 +93,7 @@ const FullCalendar = { headerRender, disabledDate, } = props; - const { sValue: value, sType: type, $listeners } = this; + const { sValue: value, sType: type } = this; let header = null; if (showHeader) { @@ -109,7 +109,7 @@ const FullCalendar = { value, }, on: { - ...$listeners, + ...getListeners(this), typeChange: this.setType, valueChange: this.setValue, }, diff --git a/components/vc-calendar/src/RangeCalendar.jsx b/components/vc-calendar/src/RangeCalendar.jsx index 57efd8c61..6aedccc8c 100644 --- a/components/vc-calendar/src/RangeCalendar.jsx +++ b/components/vc-calendar/src/RangeCalendar.jsx @@ -1,6 +1,12 @@ import PropTypes from '../../_util/vue-types'; import BaseMixin from '../../_util/BaseMixin'; -import { getOptionProps, hasProp, mergeProps, getComponentFromProp } from '../../_util/props-util'; +import { + getOptionProps, + hasProp, + mergeProps, + getComponentFromProp, + getListeners, +} from '../../_util/props-util'; import moment from 'moment'; import KeyCode from '../../_util/KeyCode'; import CalendarPart from './range-calendar/CalendarPart'; @@ -613,7 +619,7 @@ const RangeCalendar = { seperator, } = props; const clearIcon = getComponentFromProp(this, 'clearIcon'); - const { sHoverValue, sSelectedValue, sMode, showTimePicker, sValue, $listeners } = this; + const { sHoverValue, sSelectedValue, sMode, showTimePicker, sValue } = this; const className = { [prefixCls]: 1, [`${prefixCls}-hidden`]: !props.visible, @@ -623,7 +629,7 @@ const RangeCalendar = { }; const baseProps = { props, - on: $listeners, + on: getListeners(this), }; const newProps = { props: { diff --git a/components/vc-calendar/src/calendar/CalendarFooter.jsx b/components/vc-calendar/src/calendar/CalendarFooter.jsx index ee084aa8c..ddad73528 100644 --- a/components/vc-calendar/src/calendar/CalendarFooter.jsx +++ b/components/vc-calendar/src/calendar/CalendarFooter.jsx @@ -1,6 +1,6 @@ import PropTypes from '../../../_util/vue-types'; import BaseMixin from '../../../_util/BaseMixin'; -import { getOptionProps } from '../../../_util/props-util'; +import { getOptionProps, getListeners } from '../../../_util/props-util'; import TodayButton from './TodayButton'; import OkButton from './OkButton'; import TimePickerButton from './TimePickerButton'; @@ -37,7 +37,6 @@ const CalendarFooter = { render() { const props = getOptionProps(this); - const { $listeners } = this; const { value, prefixCls, showOk, timePicker, renderFooter, showToday, mode } = props; let footerEl = null; const extraFooter = renderFooter && renderFooter(mode); @@ -47,7 +46,7 @@ const CalendarFooter = { ...props, value: value, }, - on: $listeners, + on: getListeners(this), }; let nowEl = null; if (showToday) { diff --git a/components/vc-calendar/src/calendar/CalendarHeader.jsx b/components/vc-calendar/src/calendar/CalendarHeader.jsx index 61d9ec6ec..7d7e5a06f 100644 --- a/components/vc-calendar/src/calendar/CalendarHeader.jsx +++ b/components/vc-calendar/src/calendar/CalendarHeader.jsx @@ -1,6 +1,6 @@ import PropTypes from '../../../_util/vue-types'; import BaseMixin from '../../../_util/BaseMixin'; -import { getOptionProps } from '../../../_util/props-util'; +import { getOptionProps, getListeners } from '../../../_util/props-util'; import MonthPanel from '../month/MonthPanel'; import YearPanel from '../year/YearPanel'; import DecadePanel from '../decade/DecadePanel'; @@ -51,7 +51,7 @@ const CalendarHeader = { methods: { onMonthSelect(value) { this.__emit('panelChange', value, 'date'); - if (this.$listeners.monthSelect) { + if (getListeners(this).monthSelect) { this.__emit('monthSelect', value); } else { this.__emit('valueChange', value); diff --git a/components/vc-calendar/src/date/DateTBody.jsx b/components/vc-calendar/src/date/DateTBody.jsx index f9a6d6305..bf3c04da1 100644 --- a/components/vc-calendar/src/date/DateTBody.jsx +++ b/components/vc-calendar/src/date/DateTBody.jsx @@ -1,5 +1,5 @@ import PropTypes from '../../../_util/vue-types'; -import { getOptionProps } from '../../../_util/props-util'; +import { getOptionProps, getListeners } from '../../../_util/props-util'; import cx from 'classnames'; import DateConstants from './DateConstants'; import { getTitleString, getTodayTime } from '../util/'; @@ -50,8 +50,7 @@ const DateTBody = { disabledDate, hoverValue, } = props; - const { $listeners = {} } = this; - const { select = noop, dayHover = noop } = $listeners; + const { select = noop, dayHover = noop } = getListeners(this); let iIndex; let jIndex; let current; diff --git a/components/vc-calendar/src/month/MonthPanel.jsx b/components/vc-calendar/src/month/MonthPanel.jsx index e1d8c4519..47d3eedfc 100644 --- a/components/vc-calendar/src/month/MonthPanel.jsx +++ b/components/vc-calendar/src/month/MonthPanel.jsx @@ -1,6 +1,6 @@ import PropTypes from '../../../_util/vue-types'; import BaseMixin from '../../../_util/BaseMixin'; -import { hasProp } from '../../../_util/props-util'; +import { hasProp, getListeners } from '../../../_util/props-util'; import MonthTable from './MonthTable'; function goYear(direction) { @@ -66,7 +66,6 @@ const MonthPanel = { rootPrefixCls, disabledDate, renderFooter, - $listeners = {}, } = this; const year = sValue.year(); const prefixCls = `${rootPrefixCls}-month-panel`; @@ -86,7 +85,7 @@ const MonthPanel = { {year} diff --git a/components/vc-calendar/src/range-calendar/CalendarPart.jsx b/components/vc-calendar/src/range-calendar/CalendarPart.jsx index d4fa4d2fe..7ff0d8b3a 100644 --- a/components/vc-calendar/src/range-calendar/CalendarPart.jsx +++ b/components/vc-calendar/src/range-calendar/CalendarPart.jsx @@ -1,6 +1,6 @@ import PropTypes from '../../../_util/vue-types'; import BaseMixin from '../../../_util/BaseMixin'; -import { getOptionProps, getComponentFromProp } from '../../../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../../../_util/props-util'; import { cloneElement } from '../../../_util/vnode'; import CalendarHeader from '../calendar/CalendarHeader'; import DateTable from '../date/DateTable'; @@ -34,7 +34,7 @@ const CalendarPart = { clearIcon: PropTypes.any, }, render() { - const { $props: props, $listeners = {} } = this; + const { $props: props } = this; const { prefixCls, value, @@ -65,7 +65,7 @@ const CalendarPart = { panelChange = noop, select = noop, dayHover = noop, - } = $listeners; + } = getListeners(this); const shouldShowTimePicker = showTimePicker && timePicker; const disabledTimeConfig = shouldShowTimePicker && disabledTime ? getTimeConfig(selectedValue, disabledTime) : null; diff --git a/components/vc-calendar/src/year/YearPanel.jsx b/components/vc-calendar/src/year/YearPanel.jsx index cee1d7954..e3d4a7f67 100644 --- a/components/vc-calendar/src/year/YearPanel.jsx +++ b/components/vc-calendar/src/year/YearPanel.jsx @@ -1,5 +1,6 @@ import PropTypes from '../../../_util/vue-types'; import BaseMixin from '../../../_util/BaseMixin'; +import { getListeners } from '../../../_util/props-util'; const ROW = 4; const COL = 3; function noop() {} @@ -61,8 +62,8 @@ export default { }, render() { - const { sValue: value, locale, renderFooter, $listeners = {} } = this; - const decadePanelShow = $listeners.decadePanelShow || noop; + const { sValue: value, locale, renderFooter } = this; + const decadePanelShow = getListeners(this).decadePanelShow || noop; const years = this.years(); const currentYear = value.year(); const startYear = parseInt(currentYear / 10, 10) * 10; diff --git a/components/vc-cascader/Cascader.jsx b/components/vc-cascader/Cascader.jsx index ff5e0d056..e977e5040 100644 --- a/components/vc-cascader/Cascader.jsx +++ b/components/vc-cascader/Cascader.jsx @@ -1,4 +1,4 @@ -import { getComponentFromProp } from '../_util/props-util'; +import { getComponentFromProp, getListeners } from '../_util/props-util'; import PropTypes from '../_util/vue-types'; import Trigger from '../vc-trigger'; import Menus from './Menus'; @@ -313,14 +313,13 @@ export default { render() { const { $props, - $slots, sActiveValue, handleMenuSelect, sPopupVisible, handlePopupVisibleChange, handleKeyDown, - $listeners, } = this; + const listeners = getListeners(this); const { prefixCls, transitionName, @@ -348,7 +347,7 @@ export default { expandIcon, }, on: { - ...$listeners, + ...listeners, select: handleMenuSelect, itemDoubleClick: this.handleItemDoubleClick, }, @@ -370,7 +369,7 @@ export default { popupClassName: popupClassName + emptyMenuClassName, }, on: { - ...$listeners, + ...listeners, popupVisibleChange: handlePopupVisibleChange, }, ref: 'trigger', diff --git a/components/vc-checkbox/src/Checkbox.jsx b/components/vc-checkbox/src/Checkbox.jsx index 1133d4e41..ecbcff88c 100644 --- a/components/vc-checkbox/src/Checkbox.jsx +++ b/components/vc-checkbox/src/Checkbox.jsx @@ -1,6 +1,12 @@ import PropTypes from '../../_util/vue-types'; import classNames from 'classnames'; -import { getOptionProps, hasProp, initDefaultProps, getAttrs } from '../../_util/props-util'; +import { + getOptionProps, + hasProp, + initDefaultProps, + getAttrs, + getListeners, +} from '../../_util/props-util'; import BaseMixin from '../../_util/BaseMixin'; export default { @@ -137,7 +143,7 @@ export default { {...{ attrs: globalProps, on: { - ...this.$listeners, + ...getListeners(this), change: this.handleChange, click: this.onClick, }, diff --git a/components/vc-dialog/DialogWrap.jsx b/components/vc-dialog/DialogWrap.jsx index 29062738c..9f296a7f3 100644 --- a/components/vc-dialog/DialogWrap.jsx +++ b/components/vc-dialog/DialogWrap.jsx @@ -1,7 +1,7 @@ import Dialog from './Dialog'; import ContainerRender from '../_util/ContainerRender'; import getDialogPropTypes from './IDialogPropTypes'; -import { getStyle, getClass } from '../_util/props-util'; +import { getStyle, getClass, getListeners } from '../_util/props-util'; const IDialogPropTypes = getDialogPropTypes(); let openCount = 0; const DialogWrap = { @@ -37,7 +37,7 @@ const DialogWrap = { }, methods: { getComponent(extra = {}) { - const { $attrs, $listeners, $props, $slots, getContainer } = this; + const { $attrs, $props, $slots, getContainer } = this; const { on, ...otherProps } = extra; const dialogProps = { props: { @@ -51,7 +51,7 @@ const DialogWrap = { ref: '_component', key: 'dialog', on: { - ...$listeners, + ...getListeners(this), ...on, }, }; diff --git a/components/vc-dialog/LazyRenderBox.jsx b/components/vc-dialog/LazyRenderBox.jsx index 073e12f89..2960496f5 100644 --- a/components/vc-dialog/LazyRenderBox.jsx +++ b/components/vc-dialog/LazyRenderBox.jsx @@ -1,4 +1,5 @@ import PropTypes from '../_util/vue-types'; +import { getListeners } from '../_util/props-util'; const ILazyRenderBoxPropTypes = { visible: PropTypes.bool, @@ -9,6 +10,6 @@ const ILazyRenderBoxPropTypes = { export default { props: ILazyRenderBoxPropTypes, render() { - return
    {this.$slots.default}
    ; + return
    {this.$slots.default}
    ; }, }; diff --git a/components/vc-drawer/src/Drawer.js b/components/vc-drawer/src/Drawer.js index 8b67797bb..6743b3b99 100644 --- a/components/vc-drawer/src/Drawer.js +++ b/components/vc-drawer/src/Drawer.js @@ -2,7 +2,7 @@ import classnames from 'classnames'; import Vue from 'vue'; import ref from 'vue-ref'; import BaseMixin from '../../_util/BaseMixin'; -import { initDefaultProps, getEvents } from '../../_util/props-util'; +import { initDefaultProps, getEvents, getListeners } from '../../_util/props-util'; import { cloneElement } from '../../_util/vnode'; import ContainerRender from '../../_util/ContainerRender'; import getScrollBarSize from '../../_util/getScrollBarSize'; @@ -363,7 +363,7 @@ const Drawer = { } } } - const { change } = this.$listeners; + const { change } = getListeners(this); if (change && this.isOpenChange && this.sFirstEnter) { change(open); this.isOpenChange = false; diff --git a/components/vc-form/src/createBaseForm.jsx b/components/vc-form/src/createBaseForm.jsx index 367c18280..21b5baa30 100644 --- a/components/vc-form/src/createBaseForm.jsx +++ b/components/vc-form/src/createBaseForm.jsx @@ -7,7 +7,13 @@ import omit from 'lodash/omit'; import createFieldsStore from './createFieldsStore'; import { cloneElement } from '../../_util/vnode'; import BaseMixin from '../../_util/BaseMixin'; -import { getOptionProps, getEvents, slotHasProp, getComponentName } from '../../_util/props-util'; +import { + getOptionProps, + getEvents, + slotHasProp, + getComponentName, + getListeners, +} from '../../_util/props-util'; import PropTypes from '../../_util/vue-types'; import { @@ -704,7 +710,7 @@ function createBaseForm(option = {}, mixins = []) { }, render() { - const { $listeners, $slots } = this; + const { $slots } = this; const formProps = { [formPropName]: this.getForm(), }; @@ -714,7 +720,7 @@ function createBaseForm(option = {}, mixins = []) { ...formProps, ...restProps, }), - on: $listeners, + on: getListeners(this), ref: 'WrappedComponent', directives: [ { diff --git a/components/vc-input-number/src/InputHandler.js b/components/vc-input-number/src/InputHandler.js index 10996e1fb..ba9b64994 100755 --- a/components/vc-input-number/src/InputHandler.js +++ b/components/vc-input-number/src/InputHandler.js @@ -1,5 +1,6 @@ import PropTypes from '../../_util/vue-types'; import Touchable from '../../vc-m-feedback'; +import { getListeners } from '../../_util/props-util'; const InputHandler = { props: { @@ -13,7 +14,7 @@ const InputHandler = { disabled, activeClassName: `${prefixCls}-handler-active`, }, - on: this.$listeners, + on: getListeners(this), }; return ( diff --git a/components/vc-input-number/src/index.js b/components/vc-input-number/src/index.js index 1c5ea8f93..7c4dc16cb 100755 --- a/components/vc-input-number/src/index.js +++ b/components/vc-input-number/src/index.js @@ -1,7 +1,7 @@ // based on rc-input-number 4.4.0 import PropTypes from '../../_util/vue-types'; import BaseMixin from '../../_util/BaseMixin'; -import { initDefaultProps, hasProp, getOptionProps } from '../../_util/props-util'; +import { initDefaultProps, hasProp, getOptionProps, getListeners } from '../../_util/props-util'; import classNames from 'classnames'; import isNegativeZero from 'is-negative-zero'; import KeyCode from '../../_util/KeyCode'; @@ -674,7 +674,7 @@ export default { mouseleave = noop, mouseover = noop, mouseout = noop, - } = this.$listeners; + } = getListeners(this); const contentProps = { on: { mouseenter, mouseleave, mouseover, mouseout }, class: classes, diff --git a/components/vc-menu/DOMWrap.jsx b/components/vc-menu/DOMWrap.jsx index 577c67579..1db65ee66 100644 --- a/components/vc-menu/DOMWrap.jsx +++ b/components/vc-menu/DOMWrap.jsx @@ -4,7 +4,7 @@ import SubMenu from './SubMenu'; import BaseMixin from '../_util/BaseMixin'; import { getWidth, setStyle, menuAllProps } from './util'; import { cloneElement } from '../_util/vnode'; -import { getClass, getPropsData, getEvents } from '../_util/props-util'; +import { getClass, getPropsData, getEvents, getListeners } from '../_util/props-util'; const canUseDOM = !!( typeof window !== 'undefined' && @@ -285,7 +285,7 @@ const DOMWrap = { render() { const Tag = this.$props.tag; const tagProps = { - on: this.$listeners, + on: getListeners(this), }; return {this.renderChildren(this.$slots.default)}; }, diff --git a/components/vc-menu/Menu.jsx b/components/vc-menu/Menu.jsx index 3c9f73095..ff5d4b949 100644 --- a/components/vc-menu/Menu.jsx +++ b/components/vc-menu/Menu.jsx @@ -2,7 +2,12 @@ import PropTypes from '../_util/vue-types'; import { Provider, create } from '../_util/store'; import { default as SubPopupMenu, getActiveKey } from './SubPopupMenu'; import BaseMixin from '../_util/BaseMixin'; -import hasProp, { getOptionProps, getComponentFromProp, filterEmpty } from '../_util/props-util'; +import hasProp, { + getOptionProps, + getComponentFromProp, + filterEmpty, + getListeners, +} from '../_util/props-util'; import commonPropsType from './commonPropsType'; const Menu = { @@ -168,7 +173,7 @@ const Menu = { }, class: `${props.prefixCls}-root`, on: { - ...this.$listeners, + ...getListeners(this), click: this.onClick, openChange: this.onOpenChange, deselect: this.onDeselect, diff --git a/components/vc-menu/MenuItem.jsx b/components/vc-menu/MenuItem.jsx index a7aa04f7a..301469ae0 100644 --- a/components/vc-menu/MenuItem.jsx +++ b/components/vc-menu/MenuItem.jsx @@ -4,7 +4,7 @@ import BaseMixin from '../_util/BaseMixin'; import scrollIntoView from 'dom-scroll-into-view'; import { connect } from '../_util/store'; import { noop, menuAllProps } from './util'; -import { getComponentFromProp } from '../_util/props-util'; +import { getComponentFromProp, getListeners } from '../_util/props-util'; const props = { attribute: PropTypes.object, @@ -174,7 +174,7 @@ const MenuItem = { if (props.mode === 'inline') { style.paddingLeft = `${props.inlineIndent * props.level}px`; } - const listeners = { ...this.$listeners }; + const listeners = { ...getListeners(this) }; menuAllProps.props.forEach(key => delete props[key]); menuAllProps.on.forEach(key => delete listeners[key]); const liProps = { diff --git a/components/vc-menu/MenuItemGroup.jsx b/components/vc-menu/MenuItemGroup.jsx index a9db3dd4c..13ff0ac1e 100644 --- a/components/vc-menu/MenuItemGroup.jsx +++ b/components/vc-menu/MenuItemGroup.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { getComponentFromProp } from '../_util/props-util'; +import { getComponentFromProp, getListeners } from '../_util/props-util'; // import { menuAllProps } from './util' const MenuItemGroup = { @@ -27,7 +27,7 @@ const MenuItemGroup = { const titleClassName = `${rootPrefixCls}-item-group-title`; const listClassName = `${rootPrefixCls}-item-group-list`; // menuAllProps.props.forEach(key => delete props[key]) - const listeners = { ...this.$listeners }; + const listeners = { ...getListeners(this) }; delete listeners.click; return ( diff --git a/components/vc-menu/SubMenu.jsx b/components/vc-menu/SubMenu.jsx index d7de4f567..8dc115eab 100644 --- a/components/vc-menu/SubMenu.jsx +++ b/components/vc-menu/SubMenu.jsx @@ -6,7 +6,7 @@ import { connect } from '../_util/store'; import SubPopupMenu from './SubPopupMenu'; import placements from './placements'; import BaseMixin from '../_util/BaseMixin'; -import { getComponentFromProp, filterEmpty } from '../_util/props-util'; +import { getComponentFromProp, filterEmpty, getListeners } from '../_util/props-util'; import { requestAnimationTimeout, cancelAnimationTimeout } from '../_util/requestAnimationTimeout'; import { noop, loopMenuItemRecursively, getMenuIdFromSubMenuEventKey } from './util'; import getTransitionProps from '../_util/getTransitionProps'; @@ -333,7 +333,7 @@ const SubMenu = { renderChildren(children) { const props = this.$props; - const { select, deselect, openChange } = this.$listeners; + const { select, deselect, openChange } = getListeners(this); const subPopupMenuProps = { props: { mode: props.mode === 'horizontal' ? 'vertical' : props.mode, @@ -416,7 +416,7 @@ const SubMenu = { render() { const props = this.$props; - const { rootPrefixCls, parentMenu, $listeners = {} } = this; + const { rootPrefixCls, parentMenu } = this; const isOpen = props.isOpen; const prefixCls = this.getPrefixCls(); const isInlineMode = props.mode === 'inline'; @@ -504,7 +504,7 @@ const SubMenu = { const popupAlign = props.popupOffset ? { offset: props.popupOffset } : {}; const popupClassName = props.mode === 'inline' ? '' : props.popupClassName; const liProps = { - on: { ...omit($listeners, ['click']), ...mouseEvents }, + on: { ...omit(getListeners(this), ['click']), ...mouseEvents }, class: className, }; diff --git a/components/vc-menu/SubPopupMenu.jsx b/components/vc-menu/SubPopupMenu.jsx index f19475fd9..76fbbbea2 100644 --- a/components/vc-menu/SubPopupMenu.jsx +++ b/components/vc-menu/SubPopupMenu.jsx @@ -13,6 +13,7 @@ import { getPropsData, getEvents, getComponentFromProp, + getListeners, } from '../_util/props-util'; function allDisabled(arr) { @@ -390,7 +391,7 @@ const SubPopupMenu = { }, class: className, // Otherwise, the propagated click event will trigger another onClick - on: omit(this.$listeners || {}, ['click']), + on: omit(getListeners(this), ['click']), }; // if (props.id) { // domProps.id = props.id diff --git a/components/vc-notification/Notice.jsx b/components/vc-notification/Notice.jsx index aae60b4cf..83ab4bc8e 100644 --- a/components/vc-notification/Notice.jsx +++ b/components/vc-notification/Notice.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { getStyle, getComponentFromProp } from '../_util/props-util'; +import { getStyle, getComponentFromProp, getListeners } from '../_util/props-util'; import BaseMixin from '../_util/BaseMixin'; function noop() {} @@ -63,15 +63,7 @@ export default { }, render() { - const { - prefixCls, - closable, - clearCloseTimer, - startCloseTimer, - $slots, - close, - $listeners, - } = this; + const { prefixCls, closable, clearCloseTimer, startCloseTimer, $slots, close } = this; const componentClass = `${prefixCls}-notice`; const className = { [`${componentClass}`]: 1, @@ -85,7 +77,7 @@ export default { style={style || { right: '50%' }} onMouseenter={clearCloseTimer} onMouseleave={startCloseTimer} - onClick={$listeners.click || noop} + onClick={getListeners(this).click || noop} >
    {$slots.default}
    {closable ? ( diff --git a/components/vc-select/DropdownMenu.jsx b/components/vc-select/DropdownMenu.jsx index 3bb80fe9c..52ccfca50 100644 --- a/components/vc-select/DropdownMenu.jsx +++ b/components/vc-select/DropdownMenu.jsx @@ -5,7 +5,7 @@ import scrollIntoView from 'dom-scroll-into-view'; import { getSelectKeys, preventDefaultEvent } from './util'; import { cloneElement } from '../_util/vnode'; import BaseMixin from '../_util/BaseMixin'; -import { getSlotOptions, getComponentFromProp } from '../_util/props-util'; +import { getSlotOptions, getComponentFromProp, getListeners } from '../_util/props-util'; export default { name: 'DropdownMenu', @@ -101,7 +101,7 @@ export default { visible, } = props; const menuItemSelectedIcon = getComponentFromProp(this, 'menuItemSelectedIcon'); - const { menuDeselect, menuSelect, popupScroll } = this.$listeners; + const { menuDeselect, menuSelect, popupScroll } = getListeners(this); if (menuItems && menuItems.length) { const selectedKeys = getSelectKeys(menuItems, value); const menuProps = { @@ -191,7 +191,7 @@ export default { }, render() { const renderMenu = this.renderMenu(); - const { popupFocus, popupScroll } = this.$listeners; + const { popupFocus, popupScroll } = getListeners(this); return renderMenu ? (
    this.lazyLoadedList.indexOf(value) < 0, ); - if (this.$listeners.lazyLoad && slidesToLoad.length > 0) { + if (getListeners(this).lazyLoad && slidesToLoad.length > 0) { this.$emit('lazyLoad', slidesToLoad); } this.setState(state, () => { diff --git a/components/vc-slick/src/slider.js b/components/vc-slick/src/slider.js index 9dd7d76bd..8caddc8e8 100644 --- a/components/vc-slick/src/slider.js +++ b/components/vc-slick/src/slider.js @@ -3,7 +3,7 @@ import Vue from 'vue'; import ref from 'vue-ref'; import BaseMixin from '../../_util/BaseMixin'; import { cloneElement } from '../../_util/vnode'; -import { getStyle } from '../../_util/props-util'; +import { getStyle, getListeners } from '../../_util/props-util'; import InnerSlider from './inner-slider'; import defaultProps from './default-props'; import { canUseDOM } from './utils/innerSliderUtils'; @@ -197,9 +197,7 @@ export default { children: newChildren, __propsSymbol__: Symbol(), }, - on: { - ...this.$listeners, - }, + on: getListeners(this), directives: [ { name: 'ant-ref', diff --git a/components/vc-slider/src/Handle.jsx b/components/vc-slider/src/Handle.jsx index c346ff4d8..6c56f30a6 100644 --- a/components/vc-slider/src/Handle.jsx +++ b/components/vc-slider/src/Handle.jsx @@ -1,7 +1,7 @@ import classNames from 'classnames'; import PropTypes from '../../_util/vue-types'; import BaseMixin from '../../_util/BaseMixin'; -import { getOptionProps } from '../../_util/props-util'; +import { getOptionProps, getListeners } from '../../_util/props-util'; import addEventListener from '../../_util/Dom/addEventListener'; export default { @@ -92,7 +92,7 @@ export default { }, class: className, on: { - ...this.$listeners, + ...getListeners(this), blur: this.handleBlur, keydown: this.handleKeyDown, mousedown: this.handleMousedown, diff --git a/components/vc-steps/Step.jsx b/components/vc-steps/Step.jsx index ed7c1219b..8334bc024 100644 --- a/components/vc-steps/Step.jsx +++ b/components/vc-steps/Step.jsx @@ -1,5 +1,5 @@ import PropTypes from '../_util/vue-types'; -import { getOptionProps, getComponentFromProp } from '../_util/props-util'; +import { getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; function isString(str) { return typeof str === 'string'; @@ -88,7 +88,7 @@ export default { }; const stepProps = { class: classString, - on: this.$listeners, + on: getListeners(this), }; const stepItemStyle = {}; if (itemWidth) { diff --git a/components/vc-steps/Steps.jsx b/components/vc-steps/Steps.jsx index e4682b009..831e92b45 100644 --- a/components/vc-steps/Steps.jsx +++ b/components/vc-steps/Steps.jsx @@ -2,7 +2,7 @@ import PropTypes from '../_util/vue-types'; import BaseMixin from '../_util/BaseMixin'; import debounce from 'lodash/debounce'; import isFlexSupported from '../_util/isFlexSupported'; -import { filterEmpty, getEvents, getPropsData } from '../_util/props-util'; +import { filterEmpty, getEvents, getPropsData, getListeners } from '../_util/props-util'; import { cloneElement } from '../_util/vnode'; export default { @@ -111,7 +111,7 @@ export default { const stepsProps = { class: classString, ref: 'vcStepsRef', - on: this.$listeners, + on: getListeners(this), }; return (
    diff --git a/components/vc-switch/Switch.jsx b/components/vc-switch/Switch.jsx index a206d8e5b..db14e5bd0 100644 --- a/components/vc-switch/Switch.jsx +++ b/components/vc-switch/Switch.jsx @@ -1,6 +1,6 @@ import { switchPropTypes } from './PropTypes'; import BaseMixin from '../_util/BaseMixin'; -import { hasProp, getOptionProps, getComponentFromProp } from '../_util/props-util'; +import { hasProp, getOptionProps, getComponentFromProp, getListeners } from '../_util/props-util'; // function noop () { // } @@ -89,7 +89,7 @@ export default { const spanProps = { props: { ...restProps }, on: { - ...this.$listeners, + ...getListeners(this), keydown: this.handleKeyDown, click: this.handleClick, mouseup: this.handleMouseUp, diff --git a/components/vc-tabs/src/ScrollableInkTabBar.jsx b/components/vc-tabs/src/ScrollableInkTabBar.jsx index 98eb27418..751ae24dd 100644 --- a/components/vc-tabs/src/ScrollableInkTabBar.jsx +++ b/components/vc-tabs/src/ScrollableInkTabBar.jsx @@ -3,6 +3,7 @@ import TabBarTabsNode from './TabBarTabsNode'; import TabBarRootNode from './TabBarRootNode'; import ScrollableTabBarNode from './ScrollableTabBarNode'; import SaveRef from './SaveRef'; +import { getListeners } from '../../_util/props-util'; export default { name: 'ScrollableInkTabBar', @@ -21,7 +22,7 @@ export default { ], render() { const props = { ...this.$props }; - const listeners = this.$listeners; + const listeners = getListeners(this); const { default: renderTabBarNode } = this.$scopedSlots; return ( ( diff --git a/components/vc-tabs/src/Tabs.jsx b/components/vc-tabs/src/Tabs.jsx index 199cf052a..e1760bba9 100644 --- a/components/vc-tabs/src/Tabs.jsx +++ b/components/vc-tabs/src/Tabs.jsx @@ -3,7 +3,7 @@ import BaseMixin from '../../_util/BaseMixin'; import PropTypes from '../../_util/vue-types'; import raf from 'raf'; import KeyCode from './KeyCode'; -import { getOptionProps } from '../../_util/props-util'; +import { getOptionProps, getListeners } from '../../_util/props-util'; import { cloneElement } from '../../_util/vnode'; import Sentinel from './Sentinel'; @@ -248,7 +248,7 @@ export default { contents.push(tabBar, sentinelStart, tabContent, sentinelEnd); } const listeners = { - ...omit(this.$listeners, ['change']), + ...omit(getListeners(this), ['change']), scroll: this.onScroll, }; return
    {contents}
    ; diff --git a/components/vc-time-picker/Panel.jsx b/components/vc-time-picker/Panel.jsx index edc79a52b..cf0ee2e71 100644 --- a/components/vc-time-picker/Panel.jsx +++ b/components/vc-time-picker/Panel.jsx @@ -3,7 +3,7 @@ import PropTypes from '../_util/vue-types'; import BaseMixin from '../_util/BaseMixin'; import Header from './Header'; import Combobox from './Combobox'; -import { getComponentFromProp } from '../_util/props-util'; +import { getComponentFromProp, getListeners } from '../_util/props-util'; function noop() {} @@ -144,10 +144,9 @@ const Panel = { inputReadOnly, sValue, currentSelectPanel, - $listeners = {}, } = this; const clearIcon = getComponentFromProp(this, 'clearIcon'); - const { esc = noop, clear = noop, keydown = noop } = $listeners; + const { esc = noop, clear = noop, keydown = noop } = getListeners(this); const disabledHourOptions = this.disabledHours2(); const disabledMinuteOptions = disabledMinutes(sValue ? sValue.hour() : null); diff --git a/components/vc-tree-select/src/Base/BaseSelector.jsx b/components/vc-tree-select/src/Base/BaseSelector.jsx index 26b89e737..5d657740c 100644 --- a/components/vc-tree-select/src/Base/BaseSelector.jsx +++ b/components/vc-tree-select/src/Base/BaseSelector.jsx @@ -8,7 +8,7 @@ import { createRef } from '../util'; import PropTypes from '../../../_util/vue-types'; import classNames from 'classnames'; -import { initDefaultProps, getComponentFromProp } from '../../../_util/props-util'; +import { initDefaultProps, getComponentFromProp, getListeners } from '../../../_util/props-util'; import BaseMixin from '../../../_util/BaseMixin'; export const selectorPropTypes = () => ({ prefixCls: PropTypes.string, @@ -134,7 +134,6 @@ export default function(modeName) { } = this.$props; const { vcTreeSelect: { onSelectorKeyDown }, - $listeners, } = this; let myTabIndex = tabIndex; @@ -145,7 +144,7 @@ export default function(modeName) { return ( ); diff --git a/components/vc-tree-select/src/Select.jsx b/components/vc-tree-select/src/Select.jsx index f722aea28..7338b78a3 100644 --- a/components/vc-tree-select/src/Select.jsx +++ b/components/vc-tree-select/src/Select.jsx @@ -56,6 +56,7 @@ import { mergeProps, getPropsData, filterEmpty, + getListeners, } from '../../_util/props-util'; function getWatch(keys = []) { const watch = {}; @@ -958,7 +959,7 @@ const Select = { } // Only do the logic when `onChange` function provided - if (this.$listeners.change) { + if (getListeners(this).change) { let connectValueList; // Get value by mode @@ -1034,7 +1035,7 @@ const Select = { ariaId: this.ariaId, }, on: { - ...this.$listeners, + ...getListeners(this), choiceAnimationLeave: this.onChoiceAnimationLeave, }, scopedSlots: this.$scopedSlots, diff --git a/components/vc-tree-select/src/Selector/MultipleSelector/Selection.jsx b/components/vc-tree-select/src/Selector/MultipleSelector/Selection.jsx index 380002bd2..5fa35a17a 100644 --- a/components/vc-tree-select/src/Selector/MultipleSelector/Selection.jsx +++ b/components/vc-tree-select/src/Selector/MultipleSelector/Selection.jsx @@ -1,6 +1,6 @@ import PropTypes from '../../../../_util/vue-types'; import { toTitle, UNSELECTABLE_ATTRIBUTE, UNSELECTABLE_STYLE } from '../../util'; -import { getComponentFromProp } from '../../../../_util/props-util'; +import { getComponentFromProp, getListeners } from '../../../../_util/props-util'; import BaseMixin from '../../../../_util/BaseMixin'; const Selection = { @@ -24,7 +24,6 @@ const Selection = { render() { const { prefixCls, maxTagTextLength, label, value } = this.$props; - const { $listeners } = this; let content = label || value; if (maxTagTextLength && typeof content === 'string' && content.length > maxTagTextLength) { content = `${content.slice(0, maxTagTextLength)}...`; @@ -38,7 +37,7 @@ const Selection = { class={`${prefixCls}-selection__choice`} title={toTitle(label)} > - {$listeners.remove && ( + {getListeners(this).remove && ( {getComponentFromProp(this, 'removeIcon')} diff --git a/components/vc-tree-select/src/Selector/SingleSelector.jsx b/components/vc-tree-select/src/Selector/SingleSelector.jsx index 941afcab7..15cd1ecfd 100644 --- a/components/vc-tree-select/src/Selector/SingleSelector.jsx +++ b/components/vc-tree-select/src/Selector/SingleSelector.jsx @@ -1,6 +1,6 @@ import generateSelector, { selectorPropTypes } from '../Base/BaseSelector'; import { toTitle } from '../util'; -import { getOptionProps } from '../../../_util/props-util'; +import { getOptionProps, getListeners } from '../../../_util/props-util'; import { createRef } from '../util'; const Selector = generateSelector('single'); @@ -47,7 +47,7 @@ const SingleSelector = { ...getOptionProps(this), renderSelection: this.renderSelection, }, - on: this.$listeners, + on: getListeners(this), directives: [ { name: 'ant-ref', diff --git a/components/vc-trigger/PopupInner.jsx b/components/vc-trigger/PopupInner.jsx index 6d54d433e..502069ebc 100644 --- a/components/vc-trigger/PopupInner.jsx +++ b/components/vc-trigger/PopupInner.jsx @@ -1,5 +1,6 @@ import PropTypes from '../_util/vue-types'; import LazyRenderBox from './LazyRenderBox'; +import { getListeners } from '../_util/props-util'; export default { props: { @@ -9,9 +10,8 @@ export default { }, render() { const { prefixCls, visible, hiddenClassName } = this.$props; - const { $listeners } = this; const divProps = { - on: $listeners, + on: getListeners(this), }; return ( diff --git a/components/vc-trigger/Trigger.jsx b/components/vc-trigger/Trigger.jsx index e8abd270d..d11b24e56 100644 --- a/components/vc-trigger/Trigger.jsx +++ b/components/vc-trigger/Trigger.jsx @@ -375,7 +375,7 @@ export default { } mouseProps.mousedown = this.onPopupMouseDown; mouseProps.touchstart = this.onPopupMouseDown; - const { handleGetPopupClassFromAlign, getRootDomNode, getContainer, $listeners } = self; + const { handleGetPopupClassFromAlign, getRootDomNode, getContainer } = self; const { prefixCls, destroyPopupOnHide, @@ -415,7 +415,7 @@ export default { popupStyle, }, on: { - align: $listeners.popupAlign || noop, + align: getListeners(this).popupAlign || noop, ...mouseProps, }, directives: [ @@ -520,7 +520,7 @@ export default { createTwoChains(event) { let fn = () => {}; - const events = this.$listeners; + const events = getListeners(this); if (this.childOriginEvents[event] && events[event]) { return this[`fire${event}`]; } diff --git a/components/vc-upload/src/AjaxUploader.jsx b/components/vc-upload/src/AjaxUploader.jsx index bffd55d84..c6013d895 100644 --- a/components/vc-upload/src/AjaxUploader.jsx +++ b/components/vc-upload/src/AjaxUploader.jsx @@ -6,6 +6,7 @@ import defaultRequest from './request'; import getUid from './uid'; import attrAccept from './attr-accept'; import traverseFileTree from './traverseFileTree'; +import { getListeners } from '../../_util/props-util'; const upLoadPropTypes = { componentTag: PropTypes.string, @@ -206,7 +207,7 @@ const AjaxUploader = { }; const tagProps = { on: { - ...this.$listeners, + ...getListeners(this), ...events, }, attrs: { diff --git a/components/vc-upload/src/Upload.jsx b/components/vc-upload/src/Upload.jsx index ac3172271..1a3974744 100644 --- a/components/vc-upload/src/Upload.jsx +++ b/components/vc-upload/src/Upload.jsx @@ -1,5 +1,5 @@ import PropTypes from '../../_util/vue-types'; -import { initDefaultProps } from '../../_util/props-util'; +import { initDefaultProps, getListeners } from '../../_util/props-util'; import BaseMixin from '../../_util/BaseMixin'; import AjaxUpload from './AjaxUploader'; import IframeUpload from './IframeUploader'; @@ -83,7 +83,7 @@ export default { props: { ...this.$props, }, - on: this.$listeners, + on: getListeners(this), ref: 'uploaderRef', attrs: this.$attrs, };