- Edrward 9
+
+ Edrward 9
+
- 32
+
+ 32
+
- London Park no. 9
+
+ London Park no. 9
+
diff --git a/components/table/filterDropdown.jsx b/components/table/filterDropdown.jsx
index d6d4921cb..3ffa6c68d 100755
--- a/components/table/filterDropdown.jsx
+++ b/components/table/filterDropdown.jsx
@@ -216,7 +216,7 @@ export default {
filterIcon = filterIcon(filtered, column);
}
const dropdownIconClass = classNames({
- [`${prefixCls}-selected`]: filtered,
+ [`${prefixCls}-selected`]: 'filtered' in column ? column.filtered : filtered,
[`${prefixCls}-open`]: this.getDropdownVisible(),
});
if (!filterIcon) {
diff --git a/components/table/interface.js b/components/table/interface.js
index dc26d9fb4..eee9338f8 100644
--- a/components/table/interface.js
+++ b/components/table/interface.js
@@ -36,6 +36,7 @@ export const ColumnProps = {
fixed: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['left', 'right'])]),
filterIcon: PropTypes.any,
filteredValue: PropTypes.array,
+ filtered: PropTypes.bool,
defaultFilteredValue: PropTypes.array,
sortOrder: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['ascend', 'descend'])]),
sortDirections: PropTypes.array,
diff --git a/components/table/style/index.less b/components/table/style/index.less
index 1aea8a07e..00a8d0e06 100644
--- a/components/table/style/index.less
+++ b/components/table/style/index.less
@@ -75,7 +75,7 @@
}
}
- .@{table-prefix-cls}-filter-selected.@{iconfont-css-prefix}-filter {
+ .@{table-prefix-cls}-filter-selected.@{iconfont-css-prefix} {
color: @primary-color;
}
@@ -447,7 +447,7 @@
.@{ant-prefix}-dropdown-menu {
// https://github.com/ant-design/ant-design/issues/4916
// https://github.com/ant-design/ant-design/issues/19542
- max-height: calc(100vh - 130px);
+ max-height: ~'calc(100vh - 130px)';
overflow-x: hidden;
border: 0;
border-radius: @border-radius-base @border-radius-base 0 0;
@@ -722,7 +722,7 @@
table {
border-radius: @table-border-radius-base 0 0 0;
}
- .ant-table-thead > tr > th:last-child {
+ .@{table-prefix-cls}-thead > tr > th:last-child {
border-top-right-radius: 0;
}
}
@@ -740,7 +740,7 @@
color: transparent;
pointer-events: none;
}
- .ant-table-thead > tr > th:first-child {
+ .@{table-prefix-cls}-thead > tr > th:first-child {
border-top-left-radius: 0;
}
}
diff --git a/components/tabs/TabBar.jsx b/components/tabs/TabBar.jsx
index 4d6ab328f..f03a2cc7a 100644
--- a/components/tabs/TabBar.jsx
+++ b/components/tabs/TabBar.jsx
@@ -81,11 +81,11 @@ const TabBar = {
if (renderTabBar) {
RenderTabBar = renderTabBar(renderProps, ScrollableInkTabBar);
+ // https://github.com/vueComponent/ant-design-vue/issues/2157
+ return cloneElement(RenderTabBar, renderProps);
} else {
- RenderTabBar =
-
Content of Tab Pane 1
+
+ Content of Tab Pane 1
+
+
+
+ Content of Tab Pane 2
-
Content of Tab Pane 2
@@ -53,7 +57,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/card.md correctly 1`] = `
-
Content of Tab Pane 1
+
+ Content of Tab Pane 1
+
@@ -157,9 +163,13 @@ exports[`renders ./antdv-demo/docs/tabs/demo/custom-tab-bar.md correctly 1`] = `
-
Content of Tab Pane 1
+
+ Content of Tab Pane 1
+
+
+
+ Content of Tab Pane 2
-
Content of Tab Pane 2
@@ -188,7 +198,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/disabled.md correctly 1`] = `
@@ -258,7 +270,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/extra.md correctly 1`] = `
-
Content of tab 1
+
+ Content of tab 1
+
@@ -381,7 +395,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/nest.md correctly 1`] = `
@@ -415,7 +431,15 @@ exports[`renders ./antdv-demo/docs/tabs/demo/nest.md correctly 1`] = `
exports[`renders ./antdv-demo/docs/tabs/demo/position.md correctly 1`] = `
-
top bottom left right
+
+ top
+
+ bottom
+
+ left
+
+ right
+
@@ -436,7 +460,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/position.md correctly 1`] = `
-
Content of Tab 1
+
+ Content of Tab 1
+
@@ -448,7 +474,13 @@ exports[`renders ./antdv-demo/docs/tabs/demo/position.md correctly 1`] = `
exports[`renders ./antdv-demo/docs/tabs/demo/size.md correctly 1`] = `
-
Small Default Large
+
+ Small
+
+ Default
+
+ Large
+
@@ -470,7 +502,9 @@ exports[`renders ./antdv-demo/docs/tabs/demo/size.md correctly 1`] = `
-
Content of tab 2
+
+ Content of tab 2
+
@@ -481,7 +515,11 @@ exports[`renders ./antdv-demo/docs/tabs/demo/size.md correctly 1`] = `
exports[`renders ./antdv-demo/docs/tabs/demo/slide.md correctly 1`] = `
-
Horizontal Vertical
+
+ Horizontal
+
+ Vertical
+
diff --git a/components/tabs/style/index.less b/components/tabs/style/index.less
index b9d735dc4..00e12c50f 100644
--- a/components/tabs/style/index.less
+++ b/components/tabs/style/index.less
@@ -259,6 +259,7 @@
> .@{tab-prefix-cls}-tabpane {
flex-shrink: 0;
width: 100%;
+ -webkit-backface-visibility: hidden;
opacity: 1;
transition: opacity 0.45s;
}
diff --git a/components/tabs/tabs.jsx b/components/tabs/tabs.jsx
index a9a2cfb13..93e096118 100644
--- a/components/tabs/tabs.jsx
+++ b/components/tabs/tabs.jsx
@@ -11,6 +11,7 @@ import {
getListeners,
} from '../_util/props-util';
import { cloneElement } from '../_util/vnode';
+import isValid from '../_util/isValid';
import { ConfigConsumerProps } from '../config-provider';
import TabBar from './TabBar';
@@ -49,10 +50,9 @@ export default {
methods: {
removeTab(targetKey, e) {
e.stopPropagation();
- if (!targetKey) {
- return;
+ if(isValid(targetKey)) {
+ this.$emit('edit', targetKey, 'remove');
}
- this.$emit('edit', targetKey, 'remove');
},
handleChange(activeKey) {
this.$emit('change', activeKey);
diff --git a/components/tag/__tests__/__snapshots__/demo.test.js.snap b/components/tag/__tests__/__snapshots__/demo.test.js.snap
index e6ca7ceed..d7ebf420b 100644
--- a/components/tag/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/tag/__tests__/__snapshots__/demo.test.js.snap
@@ -4,18 +4,50 @@ exports[`renders ./antdv-demo/docs/tag/demo/basic.md correctly 1`] = `
- Tag1
- Tag2
- Tag3
+
+ Tag1
+
+
+ Tag2
+
+
+ Tag3
+
`;
exports[`renders ./antdv-demo/docs/tag/demo/colorful.md correctly 1`] = `
-
Presets:
-
pink red orange green cyan blue purple
-
Custom:
-
#f50 #2db7f5 #87d068 #108ee9
+
+ Presets:
+
+
+ pink
+
+ red
+
+ orange
+
+ green
+
+ cyan
+
+ blue
+
+ purple
+
+
+ Custom:
+
+
+ #f50
+
+ #2db7f5
+
+ #87d068
+
+ #108ee9
+
`;
diff --git a/components/time-picker/index.jsx b/components/time-picker/index.jsx
index 299f73a00..0c3436fc9 100644
--- a/components/time-picker/index.jsx
+++ b/components/time-picker/index.jsx
@@ -1,4 +1,3 @@
-import * as moment from 'moment';
import omit from 'omit.js';
import VcTimePicker from '../vc-time-picker';
import LocaleReceiver from '../locale-provider/LocaleReceiver';
@@ -8,7 +7,6 @@ import warning from '../_util/warning';
import ClockCircleOutlined from '@ant-design/icons-vue/ClockCircleOutlined';
import CloseCircleFilled from '@ant-design/icons-vue/CloseCircleFilled';
import enUS from './locale/en_US';
-import interopDefault from '../_util/interopDefault';
import {
initDefaultProps,
hasProp,
@@ -20,6 +18,12 @@ import {
import { cloneElement } from '../_util/vnode';
import { ConfigConsumerProps } from '../config-provider';
import Base from '../base';
+import {
+ checkValidate,
+ stringToMoment,
+ momentToString,
+ TimeOrTimesType,
+} from '../_util/moment-util';
export function generateShowHourMinuteSecond(format) {
// Ref: http://momentjs.com/docs/#/parsing/string-format/
@@ -29,20 +33,11 @@ export function generateShowHourMinuteSecond(format) {
showSecond: format.indexOf('s') > -1,
};
}
-function isMoment(value) {
- if (Array.isArray(value)) {
- return (
- value.length === 0 || value.findIndex(val => val === undefined || moment.isMoment(val)) !== -1
- );
- } else {
- return value === undefined || moment.isMoment(value);
- }
-}
-const MomentType = PropTypes.custom(isMoment);
+
export const TimePickerProps = () => ({
size: PropTypes.oneOf(['large', 'default', 'small']),
- value: MomentType,
- defaultValue: MomentType,
+ value: TimeOrTimesType,
+ defaultValue: TimeOrTimesType,
open: PropTypes.bool,
format: PropTypes.string,
disabled: PropTypes.bool,
@@ -73,6 +68,7 @@ export const TimePickerProps = () => ({
addon: PropTypes.any,
clearIcon: PropTypes.any,
locale: PropTypes.object,
+ valueFormat: PropTypes.string,
});
const TimePicker = {
@@ -105,22 +101,23 @@ const TimePicker = {
configProvider: { default: () => ConfigConsumerProps },
},
data() {
- const value = this.value || this.defaultValue;
- if (value && !interopDefault(moment).isMoment(value)) {
- throw new Error('The value/defaultValue of TimePicker must be a moment object, ');
- }
+ const { value, defaultValue, valueFormat } = this;
+
+ checkValidate('TimePicker', defaultValue, 'defaultValue', valueFormat);
+ checkValidate('TimePicker', value, 'value', valueFormat);
warning(
!hasProp(this, 'allowEmpty'),
'TimePicker',
'`allowEmpty` is deprecated. Please use `allowClear` instead.',
);
return {
- sValue: value,
+ sValue: stringToMoment(value || defaultValue, valueFormat),
};
},
watch: {
value(val) {
- this.setState({ sValue: val });
+ checkValidate('TimePicker', val, 'value', this.valueFormat);
+ this.setState({ sValue: stringToMoment(val, this.valueFormat) });
},
},
methods: {
@@ -156,7 +153,11 @@ const TimePicker = {
this.setState({ sValue: value });
}
const { format = 'HH:mm:ss' } = this;
- this.$emit('change', value, (value && value.format(format)) || '');
+ this.$emit(
+ 'change',
+ this.valueFormat ? momentToString(value, this.valueFormat) : value,
+ (value && value.format(format)) || '',
+ );
},
handleOpenClose({ open }) {
diff --git a/components/timeline/__tests__/__snapshots__/demo.test.js.snap b/components/timeline/__tests__/__snapshots__/demo.test.js.snap
index a31140cb3..f9ef64558 100644
--- a/components/timeline/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/timeline/__tests__/__snapshots__/demo.test.js.snap
@@ -10,7 +10,9 @@ exports[`renders ./antdv-demo/docs/timeline/demo/alternate.md correctly 1`] = `
- Solve initial network problems 2015-09-01
+
+ Solve initial network problems 2015-09-01
+
@@ -24,7 +26,9 @@ exports[`renders ./antdv-demo/docs/timeline/demo/alternate.md correctly 1`] = `
- Network problems being solved 2015-09-01
+
+ Network problems being solved 2015-09-01
+
@@ -71,12 +75,16 @@ exports[`renders ./antdv-demo/docs/timeline/demo/color.md correctly 1`] = `
- Create a services site 2015-09-01
+
+ Create a services site 2015-09-01
+
- Create a services site 2015-09-01
+
+ Create a services site 2015-09-01
+
diff --git a/components/transfer/__tests__/__snapshots__/demo.test.js.snap b/components/transfer/__tests__/__snapshots__/demo.test.js.snap
index 51dda2fce..9b1aef7e8 100644
--- a/components/transfer/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/transfer/__tests__/__snapshots__/demo.test.js.snap
@@ -2241,7 +2241,7 @@ exports[`renders ./antdv-demo/docs/transfer/demo/search.md correctly 1`] = `
exports[`renders ./antdv-demo/docs/transfer/demo/table-transfer.md correctly 1`] = `
-
+
@@ -2409,3 +2409,51 @@ exports[`renders ./antdv-demo/docs/transfer/demo/table-transfer.md correctly 1`]
disabled showSearch
`;
+
+exports[`renders ./antdv-demo/docs/transfer/demo/tree-transfer.md correctly 1`] = `
+
+`;
diff --git a/components/tree-select/index.jsx b/components/tree-select/index.jsx
index ac0ca2db2..20d721994 100644
--- a/components/tree-select/index.jsx
+++ b/components/tree-select/index.jsx
@@ -67,8 +67,21 @@ const TreeSelect = {
},
updateTreeData(treeData) {
const { $scopedSlots } = this;
+ const defaultFields = {
+ children: 'children',
+ title: 'title',
+ key: 'key',
+ label: 'label',
+ value: 'value',
+ };
+ const replaceFields = { ...defaultFields, ...this.$props.replaceFields };
return treeData.map(item => {
- const { label, title, scopedSlots = {}, children } = item;
+ const { scopedSlots = {} } = item;
+ const label = item[replaceFields.label];
+ const title = item[replaceFields.title];
+ const value = item[replaceFields.value];
+ const key = item[replaceFields.key];
+ const children = item[replaceFields.children];
let newLabel = typeof label === 'function' ? label(this.$createElement) : label;
let newTitle = typeof title === 'function' ? title(this.$createElement) : title;
if (!newLabel && scopedSlots.label && $scopedSlots[scopedSlots.label]) {
@@ -80,7 +93,9 @@ const TreeSelect = {
const treeNodeProps = {
...item,
title: newTitle || newLabel,
+ value,
dataRef: item,
+ key,
};
if (children) {
return { ...treeNodeProps, children: this.updateTreeData(children) };
diff --git a/components/tree-select/interface.jsx b/components/tree-select/interface.jsx
index c2765b0a6..f506a721d 100644
--- a/components/tree-select/interface.jsx
+++ b/components/tree-select/interface.jsx
@@ -53,4 +53,5 @@ export const TreeSelectProps = () => ({
treeDefaultExpandedKeys: PropTypes.array,
treeNodeFilterProp: PropTypes.string,
treeNodeLabelProp: PropTypes.string,
+ replaceFields: PropTypes.object.def({}),
});
diff --git a/components/vc-calendar/index.js b/components/vc-calendar/index.js
index 685b89bba..d00e1f038 100644
--- a/components/vc-calendar/index.js
+++ b/components/vc-calendar/index.js
@@ -1,4 +1,4 @@
-// based on rc-calendar 9.15.8
+// based on rc-calendar 9.15.10
import Vue from 'vue';
import ref from 'vue-ref';
import Calendar from './src/';
diff --git a/components/vc-calendar/src/Calendar.jsx b/components/vc-calendar/src/Calendar.jsx
index 9d1b16d3f..c3d6b7a9e 100644
--- a/components/vc-calendar/src/Calendar.jsx
+++ b/components/vc-calendar/src/Calendar.jsx
@@ -22,6 +22,7 @@ const getMomentObjectIfValid = date => {
};
const Calendar = {
+ name: 'Calendar',
props: {
locale: PropTypes.object.def(enUs),
format: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
@@ -54,6 +55,7 @@ const Calendar = {
clearIcon: PropTypes.any,
focusablePanel: PropTypes.bool.def(true),
inputMode: PropTypes.string,
+ inputReadOnly: PropTypes.bool,
},
mixins: [BaseMixin, CommonMixin, CalendarMixin],
@@ -250,6 +252,7 @@ const Calendar = {
sMode,
renderFooter,
inputMode,
+ inputReadOnly,
monthCellRender,
monthCellContentRender,
$props: props,
@@ -303,6 +306,7 @@ const Calendar = {
clearIcon={clearIcon}
onSelect={this.onDateInputSelect}
inputMode={inputMode}
+ inputReadOnly={inputReadOnly}
/>
) : null;
const children = [];
@@ -355,6 +359,7 @@ const Calendar = {
showDateInput={props.showDateInput}
timePicker={timePicker}
selectedValue={sSelectedValue}
+ timePickerDisabled={!sSelectedValue}
value={sValue}
disabledDate={disabledDate}
okDisabled={
diff --git a/components/vc-calendar/src/FullCalendar.jsx b/components/vc-calendar/src/FullCalendar.jsx
index a1e04649d..279389401 100644
--- a/components/vc-calendar/src/FullCalendar.jsx
+++ b/components/vc-calendar/src/FullCalendar.jsx
@@ -9,6 +9,7 @@ import CommonMixin from './mixin/CommonMixin';
import CalendarHeader from './full-calendar/CalendarHeader';
import enUs from './locale/en_US';
const FullCalendar = {
+ name: 'FullCalendar',
props: {
locale: PropTypes.object.def(enUs),
format: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
diff --git a/components/vc-calendar/src/MonthCalendar.jsx b/components/vc-calendar/src/MonthCalendar.jsx
index f0a219614..43acc7415 100644
--- a/components/vc-calendar/src/MonthCalendar.jsx
+++ b/components/vc-calendar/src/MonthCalendar.jsx
@@ -8,6 +8,7 @@ import CalendarMixin from './mixin/CalendarMixin';
import CommonMixin from './mixin/CommonMixin';
import enUs from './locale/en_US';
const MonthCalendar = {
+ name: 'MonthCalendar',
props: {
locale: PropTypes.object.def(enUs),
format: PropTypes.string,
diff --git a/components/vc-calendar/src/Picker.jsx b/components/vc-calendar/src/Picker.jsx
index 53695c7b8..f1f9cc1a6 100644
--- a/components/vc-calendar/src/Picker.jsx
+++ b/components/vc-calendar/src/Picker.jsx
@@ -7,17 +7,18 @@ import KeyCode from '../../_util/KeyCode';
import placements from './picker/placements';
import Trigger from '../../vc-trigger';
import moment from 'moment';
-import { setTimeout } from 'timers';
-function isMoment(value) {
- if (Array.isArray(value)) {
- return (
- value.length === 0 || value.findIndex(val => val === undefined || moment.isMoment(val)) !== -1
- );
- } else {
- return value === undefined || moment.isMoment(value);
- }
-}
-const MomentType = PropTypes.custom(isMoment);
+import isNil from 'lodash/isNil';
+const TimeType = {
+ validator(value) {
+ if (Array.isArray(value)) {
+ return (
+ value.length === 0 || value.findIndex(val => !isNil(val) && !moment.isMoment(val)) === -1
+ );
+ } else {
+ return isNil(value) || moment.isMoment(value);
+ }
+ },
+};
const Picker = {
name: 'Picker',
props: {
@@ -34,8 +35,8 @@ const Picker = {
defaultOpen: PropTypes.bool.def(false),
prefixCls: PropTypes.string.def('rc-calendar-picker'),
placement: PropTypes.any.def('bottomLeft'),
- value: PropTypes.oneOfType([MomentType, PropTypes.arrayOf(MomentType)]),
- defaultValue: PropTypes.oneOfType([MomentType, PropTypes.arrayOf(MomentType)]),
+ value: TimeType,
+ defaultValue: TimeType,
align: PropTypes.object.def(() => ({})),
dropdownClassName: PropTypes.string,
dateRender: PropTypes.func,
diff --git a/components/vc-calendar/src/RangeCalendar.jsx b/components/vc-calendar/src/RangeCalendar.jsx
index 1a35d07be..05e3cce20 100644
--- a/components/vc-calendar/src/RangeCalendar.jsx
+++ b/components/vc-calendar/src/RangeCalendar.jsx
@@ -119,6 +119,7 @@ const RangeCalendar = {
renderSidebar: PropTypes.func.def(() => null),
dateRender: PropTypes.func,
clearIcon: PropTypes.any,
+ inputReadOnly: PropTypes.bool,
},
mixins: [BaseMixin, CommonMixin],
@@ -434,7 +435,7 @@ const RangeCalendar = {
const newValue = [sValue[0], value || sValue[1]];
this.__emit('panelChange', newValue, newMode);
const newState = {
- sPanelTriggerSource: 'start',
+ sPanelTriggerSource: 'end',
};
if (!hasProp(this, 'mode')) {
newState.sMode = newMode;
@@ -493,7 +494,7 @@ const RangeCalendar = {
// Adjust month if date not align
if (
!showTimePicker &&
- panelTriggerSource !== 'end' &&
+ panelTriggerSource === 'start' &&
mode[0] === 'date' &&
mode[1] === 'date' &&
endValue.isSame(value[0], 'month')
diff --git a/components/vc-calendar/src/date/DateInput.jsx b/components/vc-calendar/src/date/DateInput.jsx
index d96275411..70e553b3e 100644
--- a/components/vc-calendar/src/date/DateInput.jsx
+++ b/components/vc-calendar/src/date/DateInput.jsx
@@ -26,6 +26,7 @@ const DateInput = {
selectedValue: PropTypes.object,
clearIcon: PropTypes.any,
inputMode: PropTypes.string,
+ inputReadOnly: PropTypes.bool,
},
data() {
@@ -38,10 +39,10 @@ const DateInput = {
},
watch: {
selectedValue() {
- this.updateState();
+ this.setState();
},
format() {
- this.updateState();
+ this.setState();
},
},
@@ -61,19 +62,21 @@ const DateInput = {
return dateInputInstance;
},
methods: {
- updateState() {
+ getDerivedStateFromProps(nextProps, state) {
+ let newState = {};
if (dateInputInstance) {
cachedSelectionStart = dateInputInstance.selectionStart;
cachedSelectionEnd = dateInputInstance.selectionEnd;
}
// when popup show, click body will call this, bug!
- const selectedValue = this.selectedValue;
- if (!this.$data.hasFocus) {
- this.setState({
+ const selectedValue = nextProps.selectedValue;
+ if (!state.hasFocus) {
+ newState = {
str: formatDate(selectedValue, this.format),
invalid: false,
- });
+ };
}
+ return newState;
},
onClear() {
this.setState({
@@ -84,7 +87,7 @@ const DateInput = {
onInputChange(e) {
const { value: str, composing } = e.target;
const { str: oldStr = '' } = this;
- if (composing || oldStr === str) return;
+ if (e.isComposing || composing || oldStr === str) return;
const { disabledDate, format, selectedValue } = this.$props;
@@ -166,7 +169,17 @@ const DateInput = {
},
render() {
- const { invalid, str, locale, prefixCls, placeholder, disabled, showClear, inputMode } = this;
+ const {
+ invalid,
+ str,
+ locale,
+ prefixCls,
+ placeholder,
+ disabled,
+ showClear,
+ inputMode,
+ inputReadOnly,
+ } = this;
const clearIcon = getComponentFromProp(this, 'clearIcon');
const invalidClass = invalid ? `${prefixCls}-input-invalid` : '';
return (
@@ -193,6 +206,7 @@ const DateInput = {
onFocus={this.onFocus}
onBlur={this.onBlur}
inputMode={inputMode}
+ readOnly={inputReadOnly}
/>
{showClear ? (
diff --git a/components/vc-calendar/src/full-calendar/CalendarHeader.jsx b/components/vc-calendar/src/full-calendar/CalendarHeader.jsx
index 55f6401c0..a4b9c8159 100644
--- a/components/vc-calendar/src/full-calendar/CalendarHeader.jsx
+++ b/components/vc-calendar/src/full-calendar/CalendarHeader.jsx
@@ -3,6 +3,7 @@ import BaseMixin from '../../../_util/BaseMixin';
import { getMonthName } from '../util';
const CalendarHeader = {
+ name: 'CalendarHeader',
mixins: [BaseMixin],
props: {
value: PropTypes.object,
diff --git a/components/vc-calendar/src/month/MonthTable.jsx b/components/vc-calendar/src/month/MonthTable.jsx
index 605a66a8a..ca1b943a8 100644
--- a/components/vc-calendar/src/month/MonthTable.jsx
+++ b/components/vc-calendar/src/month/MonthTable.jsx
@@ -5,15 +5,10 @@ import { getTodayTime, getMonthName } from '../util/index';
const ROW = 4;
const COL = 3;
-function chooseMonth(month) {
- const next = this.sValue.clone();
- next.month(month);
- this.setAndSelectValue(next);
-}
-
function noop() {}
const MonthTable = {
+ name: 'MonthTable',
mixins: [BaseMixin],
props: {
cellRender: PropTypes.func,
@@ -42,7 +37,11 @@ const MonthTable = {
});
this.__emit('select', value);
},
-
+ chooseMonth(month) {
+ const next = this.sValue.clone();
+ next.month(month);
+ this.setAndSelectValue(next);
+ },
months() {
const value = this.sValue;
const current = value.clone();
@@ -107,7 +106,7 @@ const MonthTable = {
this.chooseMonth(monthData.value)}
title={monthData.title}
class={classNameMap}
>
diff --git a/components/vc-calendar/src/range-calendar/CalendarPart.jsx b/components/vc-calendar/src/range-calendar/CalendarPart.jsx
index 7ca6349cc..3191cdaec 100644
--- a/components/vc-calendar/src/range-calendar/CalendarPart.jsx
+++ b/components/vc-calendar/src/range-calendar/CalendarPart.jsx
@@ -33,6 +33,7 @@ const CalendarPart = {
clearIcon: PropTypes.any,
dateRender: PropTypes.func,
inputMode: PropTypes.string,
+ inputReadOnly: PropTypes.bool,
},
render() {
const { $props: props } = this;
@@ -59,6 +60,7 @@ const CalendarPart = {
showWeekNumber,
showClear,
inputMode,
+ inputReadOnly,
} = props;
const clearIcon = getComponentFromProp(this, 'clearIcon');
const {
@@ -112,11 +114,11 @@ const CalendarPart = {
value={value}
showClear={showClear || false}
selectedValue={selectedValue[index]}
- onChange={inputSelect}
onChange={inputChange}
onSelect={inputSelect}
clearIcon={clearIcon}
inputMode={inputMode}
+ inputReadOnly={inputReadOnly}
/>
);
const headerProps = {
diff --git a/components/vc-dialog/Dialog.jsx b/components/vc-dialog/Dialog.jsx
index 2d6165647..7a81002a5 100644
--- a/components/vc-dialog/Dialog.jsx
+++ b/components/vc-dialog/Dialog.jsx
@@ -219,8 +219,10 @@ export default {
bodyProps,
forceRender,
closeIcon,
+ dialogStyle,
+ dialogClass,
} = this;
- const dest = {};
+ const dest = { ...dialogStyle };
if (width !== undefined) {
dest.width = typeof width === 'number' ? `${width}px` : width;
}
@@ -263,11 +265,10 @@ export default {
);
}
- const style = { ...this.dialogStyle, ...dest };
+ const style = dest;
const sentinelStyle = { width: 0, height: 0, overflow: 'hidden' };
const cls = {
[prefixCls]: true,
- ...this.dialogClass,
};
const transitionName = this.getTransitionName();
const dialogElement = (
@@ -277,7 +278,7 @@ export default {
role="document"
ref="dialog"
style={style}
- class={cls}
+ class={[cls, dialogClass]}
forceRender={forceRender}
onMousedown={this.onDialogMouseDown}
>
diff --git a/components/vc-dialog/DialogWrap.jsx b/components/vc-dialog/DialogWrap.jsx
index 9f296a7f3..72e721cc0 100644
--- a/components/vc-dialog/DialogWrap.jsx
+++ b/components/vc-dialog/DialogWrap.jsx
@@ -1,87 +1,43 @@
import Dialog from './Dialog';
-import ContainerRender from '../_util/ContainerRender';
import getDialogPropTypes from './IDialogPropTypes';
-import { getStyle, getClass, getListeners } from '../_util/props-util';
+import { getListeners } from '../_util/props-util';
+import Portal from '../_util/PortalWrapper';
const IDialogPropTypes = getDialogPropTypes();
-let openCount = 0;
const DialogWrap = {
inheritAttrs: false,
props: {
...IDialogPropTypes,
visible: IDialogPropTypes.visible.def(false),
},
- data() {
- openCount = this.visible ? openCount + 1 : openCount;
- this.renderComponent = () => {};
- this.removeContainer = () => {};
- return {};
- },
- watch: {
- visible(val, preVal) {
- openCount = val && !preVal ? openCount + 1 : openCount - 1;
- },
- },
- beforeDestroy() {
- if (this.visible) {
- openCount = openCount ? openCount - 1 : openCount;
- this.renderComponent({
- afterClose: this.removeContainer,
- visible: false,
- on: {
- close() {},
- },
- });
- } else {
- this.removeContainer();
- }
- },
- methods: {
- getComponent(extra = {}) {
- const { $attrs, $props, $slots, getContainer } = this;
- const { on, ...otherProps } = extra;
- const dialogProps = {
- props: {
- ...$props,
- dialogClass: getClass(this),
- dialogStyle: getStyle(this),
- ...otherProps,
- getOpenCount: getContainer === false ? () => 2 : () => openCount,
- },
- attrs: $attrs,
- ref: '_component',
- key: 'dialog',
- on: {
- ...getListeners(this),
- ...on,
- },
- };
- return {$slots.default} ;
- },
-
- getContainer2() {
- const container = document.createElement('div');
- if (this.getContainer) {
- this.getContainer().appendChild(container);
- } else {
- document.body.appendChild(container);
- }
- return container;
- },
- },
render() {
- const { visible } = this;
+ const { visible, getContainer, forceRender } = this.$props;
+ const dialogProps = {
+ props: this.$props,
+ attrs: this.$attrs,
+ ref: '_component',
+ key: 'dialog',
+ on: getListeners(this),
+ };
+ // 渲染在当前 dom 里；
+ if (getContainer === false) {
+ return (
+ 2} // 不对 body 做任何操作。。
+ >
+ {this.$slots.default}
+
+ );
+ }
return (
- {
- this.renderComponent = renderComponent;
- this.removeContainer = removeContainer;
- return null;
+ forceRender={forceRender}
+ getContainer={getContainer}
+ children={childProps => {
+ dialogProps.props = { ...dialogProps.props, ...childProps };
+ return {this.$slots.default} ;
}}
/>
);
diff --git a/components/vc-dialog/IDialogPropTypes.js b/components/vc-dialog/IDialogPropTypes.js
index a15a153a5..9ad6b0a9f 100644
--- a/components/vc-dialog/IDialogPropTypes.js
+++ b/components/vc-dialog/IDialogPropTypes.js
@@ -33,7 +33,7 @@ function IDialogPropTypes() {
wrapProps: PropTypes.any,
getContainer: PropTypes.any,
dialogStyle: PropTypes.object.def(() => ({})),
- dialogClass: PropTypes.object.def(() => ({})),
+ dialogClass: PropTypes.string.def(''),
closeIcon: PropTypes.any,
forceRender: PropTypes.bool,
getOpenCount: PropTypes.func,
diff --git a/components/vc-drawer/src/Drawer.js b/components/vc-drawer/src/Drawer.js
index bb30a7e54..934f6e161 100644
--- a/components/vc-drawer/src/Drawer.js
+++ b/components/vc-drawer/src/Drawer.js
@@ -4,7 +4,6 @@ import ref from 'vue-ref';
import BaseMixin from '../../_util/BaseMixin';
import { initDefaultProps, getEvents, getListeners } from '../../_util/props-util';
import { cloneElement } from '../../_util/vnode';
-import ContainerRender from '../../_util/ContainerRender';
import getScrollBarSize from '../../_util/getScrollBarSize';
import { IDrawerProps } from './IDrawerPropTypes';
import KeyCode from '../../_util/KeyCode';
@@ -17,6 +16,7 @@ import {
transformArguments,
isNumeric,
} from './utils';
+import Portal from '../../_util/Portal';
function noop() {}
@@ -135,21 +135,9 @@ const Drawer = {
this.setLevelDomTransform(false, true);
}
document.body.style.overflow = '';
- // 拦不住。。直接删除；
- if (this.getSelfContainer) {
- this.container.parentNode.removeChild(this.container);
- }
}
this.sFirstEnter = false;
clearTimeout(this.timeout);
- // 需要 didmount 后也会渲染，直接 unmount 将不会渲染，加上判断.
- if (this.renderComponent) {
- this.renderComponent({
- afterClose: this.removeContainer,
- onClose() {},
- visible: false,
- });
- }
},
methods: {
onKeyDown(e) {
@@ -610,8 +598,9 @@ const Drawer = {
},
render() {
- const { getContainer, wrapperClassName } = this.$props;
+ const { getContainer, wrapperClassName, handler, forceRender } = this.$props;
const open = this.getOpen();
+ let portal = null;
currentDrawer[this.drawerId] = open ? this.container : open;
const children = this.getChildToRender(this.sFirstEnter ? open : false);
if (!getContainer) {
@@ -624,7 +613,7 @@ const Drawer = {
},
];
return (
-
+
{children}
);
@@ -632,21 +621,12 @@ const Drawer = {
if (!this.container || (!open && !this.sFirstEnter)) {
return null;
}
- return (
-
children}
- getContainer={this.getSelfContainer}
- children={({ renderComponent, removeContainer }) => {
- this.renderComponent = renderComponent;
- this.removeContainer = removeContainer;
- return null;
- }}
- />
- );
+ // 如果有 handler 为内置强制渲染；
+ const $forceRender = !!handler || forceRender;
+ if ($forceRender || open || this.dom) {
+ portal = {overflowedItems} ;
@@ -263,7 +269,10 @@ const DOMWrap = {
c,
// children[index].key will become '.$key' in clone by default,
// we have to overwrite with the correct key explicitly
- { key: getPropsData(c).eventKey, props: { mode: 'vertical-left' } },
+ {
+ key: getPropsData(c).eventKey,
+ props: { mode: 'vertical-left' },
+ },
);
});
diff --git a/components/vc-menu/SubMenu.jsx b/components/vc-menu/SubMenu.jsx
index 4d5c87eda..2ea57b48a 100644
--- a/components/vc-menu/SubMenu.jsx
+++ b/components/vc-menu/SubMenu.jsx
@@ -70,6 +70,7 @@ const SubMenu = {
builtinPlacements: PropTypes.object.def(() => ({})),
itemIcon: PropTypes.any,
expandIcon: PropTypes.any,
+ subMenuKey: PropTypes.string,
},
mixins: [BaseMixin],
isSubMenu: true,
diff --git a/components/vc-menu/SubPopupMenu.jsx b/components/vc-menu/SubPopupMenu.jsx
index d101a7dd6..1194ab264 100644
--- a/components/vc-menu/SubPopupMenu.jsx
+++ b/components/vc-menu/SubPopupMenu.jsx
@@ -337,10 +337,8 @@ const SubPopupMenu = {
},
on: {
click: e => {
- if ('keyPath' in e) {
- (childListeners.click || noop)(e);
- this.onClick(e);
- }
+ (childListeners.click || noop)(e);
+ this.onClick(e);
},
itemHover: this.onItemHover,
openChange: this.onOpenChange,
diff --git a/components/vc-pagination/Options.jsx b/components/vc-pagination/Options.jsx
index aef1f2975..316518735 100644
--- a/components/vc-pagination/Options.jsx
+++ b/components/vc-pagination/Options.jsx
@@ -33,7 +33,7 @@ export default {
},
handleChange(e) {
const { value, composing } = e.target;
- if (composing || this.goInputText === value) return;
+ if (e.isComposing || composing || this.goInputText === value) return;
this.setState({
goInputText: value,
});
diff --git a/components/vc-pagination/Pagination.jsx b/components/vc-pagination/Pagination.jsx
index 3af853e58..14d75f3e9 100644
--- a/components/vc-pagination/Pagination.jsx
+++ b/components/vc-pagination/Pagination.jsx
@@ -195,7 +195,7 @@ export default {
}
},
handleKeyUp(e) {
- if (e.target.composing) return;
+ if (e.isComposing || e.target.composing) return;
const value = this.getValidValue(e);
const stateCurrentInputValue = this.stateCurrentInputValue;
diff --git a/components/vc-select/Select.jsx b/components/vc-select/Select.jsx
index 69b85c6b0..754bd7d33 100644
--- a/components/vc-select/Select.jsx
+++ b/components/vc-select/Select.jsx
@@ -161,7 +161,7 @@ const Select = {
return {
...state,
_mirrorInputValue: state._inputValue, // https://github.com/vueComponent/ant-design-vue/issues/1458
- ...this.getDerivedStateFromProps(props, state),
+ ...this.getDerivedState(props, state),
};
},
@@ -179,7 +179,7 @@ const Select = {
},
watch: {
__propsSymbol__() {
- Object.assign(this.$data, this.getDerivedStateFromProps(getOptionProps(this), this.$data));
+ Object.assign(this.$data, this.getDerivedState(getOptionProps(this), this.$data));
},
'$data._inputValue'(val) {
this.$data._mirrorInputValue = val;
@@ -210,7 +210,7 @@ const Select = {
}
},
methods: {
- getDerivedStateFromProps(nextProps, prevState) {
+ getDerivedState(nextProps, prevState) {
const optionsInfo = prevState._skipBuildOptionsInfo
? prevState._optionsInfo
: this.getOptionsInfoFromProps(nextProps, prevState);
@@ -323,7 +323,7 @@ const Select = {
onInputChange(e) {
const { value: val, composing } = e.target;
const { _inputValue = '' } = this.$data;
- if (composing || _inputValue === val) {
+ if (e.isComposing || composing || _inputValue === val) {
this.setState({
_mirrorInputValue: val,
});
diff --git a/components/vc-tabs/src/Tabs.jsx b/components/vc-tabs/src/Tabs.jsx
index d26ef9651..e7b2e3b9f 100644
--- a/components/vc-tabs/src/Tabs.jsx
+++ b/components/vc-tabs/src/Tabs.jsx
@@ -6,12 +6,13 @@ import KeyCode from './KeyCode';
import { getOptionProps, getListeners } from '../../_util/props-util';
import { cloneElement } from '../../_util/vnode';
import Sentinel from './Sentinel';
+import isValid from '../../_util/isValid';
function getDefaultActiveKey(props) {
let activeKey;
const children = props.children;
children.forEach(child => {
- if (child && !activeKey && !child.disabled) {
+ if (child && !isValid(activeKey) && !child.disabled) {
activeKey = child.key;
}
});
diff --git a/components/vc-time-picker/Header.jsx b/components/vc-time-picker/Header.jsx
index 5ab94db92..45be581cd 100644
--- a/components/vc-time-picker/Header.jsx
+++ b/components/vc-time-picker/Header.jsx
@@ -61,7 +61,7 @@ const Header = {
onInputChange(e) {
const { value: str, composing } = e.target;
const { str: oldStr = '' } = this;
- if (composing || oldStr === str) return;
+ if (e.isComposing || composing || oldStr === str) return;
this.setState({
str,
diff --git a/components/vc-tree-select/src/Base/BasePopup.jsx b/components/vc-tree-select/src/Base/BasePopup.jsx
index 6de0cede9..571147cd5 100644
--- a/components/vc-tree-select/src/Base/BasePopup.jsx
+++ b/components/vc-tree-select/src/Base/BasePopup.jsx
@@ -9,7 +9,7 @@ import { createRef } from '../util';
// onTreeNodeSelect: PropTypes.func.isRequired,
// onTreeNodeCheck: PropTypes.func.isRequired,
// }
-function getDerivedStateFromProps(nextProps, prevState) {
+function getDerivedState(nextProps, prevState) {
const {
_prevProps: prevProps = {},
_loadedKeys: loadedKeys,
@@ -106,7 +106,7 @@ const BasePopup = {
},
watch: {
__propsSymbol__() {
- const state = getDerivedStateFromProps(this.$props, this.$data);
+ const state = getDerivedState(this.$props, this.$data);
this.setState(state);
},
},
@@ -124,14 +124,14 @@ const BasePopup = {
const state = {
_keyList: [],
_expandedKeyList: expandedKeyList,
- // Cache `expandedKeyList` when tree is in filter. This is used in `getDerivedStateFromProps`
+ // Cache `expandedKeyList` when tree is in filter. This is used in `getDerivedState`
_cachedExpandedKeyList: [],
_loadedKeys: [],
_prevProps: {},
};
return {
...state,
- ...getDerivedStateFromProps(this.$props, state),
+ ...getDerivedState(this.$props, state),
};
},
methods: {
diff --git a/components/vc-tree-select/src/SearchInput.jsx b/components/vc-tree-select/src/SearchInput.jsx
index b51c3eb84..78f229661 100644
--- a/components/vc-tree-select/src/SearchInput.jsx
+++ b/components/vc-tree-select/src/SearchInput.jsx
@@ -98,7 +98,7 @@ const SearchInput = {
handleInputChange(e) {
const { value, composing } = e.target;
const { searchValue = '' } = this;
- if (composing || searchValue === value) {
+ if (e.isComposing || composing || searchValue === value) {
this.mirrorSearchValue = value;
return;
}
diff --git a/components/vc-tree-select/src/Select.jsx b/components/vc-tree-select/src/Select.jsx
index 69678c7d9..3c084985f 100644
--- a/components/vc-tree-select/src/Select.jsx
+++ b/components/vc-tree-select/src/Select.jsx
@@ -187,7 +187,7 @@ const Select = {
_treeNodes: undefined,
_filteredTreeNodes: undefined,
};
- const newState = this.getDerivedStateFromProps(this.$props, state);
+ const newState = this.getDerivedState(this.$props, state);
return {
...state,
...newState,
@@ -215,7 +215,7 @@ const Select = {
watch: {
...getWatch(['treeData', 'defaultValue', 'value']),
__propsSymbol__() {
- const state = this.getDerivedStateFromProps(this.$props, this.$data);
+ const state = this.getDerivedState(this.$props, this.$data);
this.setState(state);
this.needSyncKeys = {};
},
@@ -266,7 +266,7 @@ const Select = {
},
methods: {
- getDerivedStateFromProps(nextProps, prevState) {
+ getDerivedState(nextProps, prevState) {
const h = this.$createElement;
const { _prevProps: prevProps = {} } = prevState;
const {
diff --git a/components/vc-tree/src/Tree.jsx b/components/vc-tree/src/Tree.jsx
index aa2840b00..6647e37be 100644
--- a/components/vc-tree/src/Tree.jsx
+++ b/components/vc-tree/src/Tree.jsx
@@ -128,7 +128,7 @@ const Tree = {
};
return {
...state,
- ...this.getDerivedStateFromProps(getOptionProps(this), state),
+ ...this.getDerivedState(getOptionProps(this), state),
};
},
provide() {
@@ -148,13 +148,13 @@ const Tree = {
'loadedKeys',
]),
__propsSymbol__() {
- this.setState(this.getDerivedStateFromProps(getOptionProps(this), this.$data));
+ this.setState(this.getDerivedState(getOptionProps(this), this.$data));
this.needSyncKeys = {};
},
},
methods: {
- getDerivedStateFromProps(props, prevState) {
+ getDerivedState(props, prevState) {
const { _prevProps } = prevState;
const newState = {
_prevProps: { ...props },
diff --git a/components/vc-trigger/Trigger.jsx b/components/vc-trigger/Trigger.jsx
index ed462eb7f..2256e00d0 100644
--- a/components/vc-trigger/Trigger.jsx
+++ b/components/vc-trigger/Trigger.jsx
@@ -5,7 +5,7 @@ import contains from '../vc-util/Dom/contains';
import {
hasProp,
getComponentFromProp,
- getEvents,
+ getDataEvents,
filterEmpty,
getListeners,
} from '../_util/props-util';
@@ -595,48 +595,48 @@ export default {
warning(false, 'Trigger $slots.default.length > 1, just support only one default', true);
}
const child = children[0];
- this.childOriginEvents = getEvents(child);
+ this.childOriginEvents = getDataEvents(child);
const newChildProps = {
props: {},
- on: {},
+ nativeOn: {},
key: 'trigger',
};
if (this.isContextmenuToShow()) {
- newChildProps.on.contextmenu = this.onContextmenu;
+ newChildProps.nativeOn.contextmenu = this.onContextmenu;
} else {
- newChildProps.on.contextmenu = this.createTwoChains('contextmenu');
+ newChildProps.nativeOn.contextmenu = this.createTwoChains('contextmenu');
}
if (this.isClickToHide() || this.isClickToShow()) {
- newChildProps.on.click = this.onClick;
- newChildProps.on.mousedown = this.onMousedown;
- newChildProps.on.touchstart = this.onTouchstart;
+ newChildProps.nativeOn.click = this.onClick;
+ newChildProps.nativeOn.mousedown = this.onMousedown;
+ newChildProps.nativeOn.touchstart = this.onTouchstart;
} else {
- newChildProps.on.click = this.createTwoChains('click');
- newChildProps.on.mousedown = this.createTwoChains('mousedown');
- newChildProps.on.touchstart = this.createTwoChains('onTouchstart');
+ newChildProps.nativeOn.click = this.createTwoChains('click');
+ newChildProps.nativeOn.mousedown = this.createTwoChains('mousedown');
+ newChildProps.nativeOn.touchstart = this.createTwoChains('onTouchstart');
}
if (this.isMouseEnterToShow()) {
- newChildProps.on.mouseenter = this.onMouseenter;
+ newChildProps.nativeOn.mouseenter = this.onMouseenter;
if (alignPoint) {
- newChildProps.on.mousemove = this.onMouseMove;
+ newChildProps.nativeOn.mousemove = this.onMouseMove;
}
} else {
- newChildProps.on.mouseenter = this.createTwoChains('mouseenter');
+ newChildProps.nativeOn.mouseenter = this.createTwoChains('mouseenter');
}
if (this.isMouseLeaveToHide()) {
- newChildProps.on.mouseleave = this.onMouseleave;
+ newChildProps.nativeOn.mouseleave = this.onMouseleave;
} else {
- newChildProps.on.mouseleave = this.createTwoChains('mouseleave');
+ newChildProps.nativeOn.mouseleave = this.createTwoChains('mouseleave');
}
if (this.isFocusToShow() || this.isBlurToHide()) {
- newChildProps.on.focus = this.onFocus;
- newChildProps.on.blur = this.onBlur;
+ newChildProps.nativeOn.focus = this.onFocus;
+ newChildProps.nativeOn.blur = this.onBlur;
} else {
- newChildProps.on.focus = this.createTwoChains('focus');
- newChildProps.on.blur = e => {
+ newChildProps.nativeOn.focus = this.createTwoChains('focus');
+ newChildProps.nativeOn.blur = e => {
if (e && (!e.relatedTarget || !contains(e.target, e.relatedTarget))) {
this.createTwoChains('blur')(e);
}
diff --git a/components/vc-trigger/t.js b/components/vc-trigger/t.js
new file mode 100644
index 000000000..1300026b3
--- /dev/null
+++ b/components/vc-trigger/t.js
@@ -0,0 +1,665 @@
+import Vue from 'vue';
+import ref from 'vue-ref';
+import PropTypes from '../_util/vue-types';
+import contains from '../vc-util/Dom/contains';
+import {
+ hasProp,
+ getComponentFromProp,
+ getEvents,
+ filterEmpty,
+ getListeners,
+} from '../_util/props-util';
+import { requestAnimationTimeout, cancelAnimationTimeout } from '../_util/requestAnimationTimeout';
+import addEventListener from '../vc-util/Dom/addEventListener';
+import warning from '../_util/warning';
+import Popup from './Popup';
+import { getAlignFromPlacement, getAlignPopupClassName, noop } from './utils';
+import BaseMixin from '../_util/BaseMixin';
+import { cloneElement } from '../_util/vnode';
+import Portal from '../_util/Portal';
+
+Vue.use(ref, { name: 'ant-ref' });
+
+function returnEmptyString() {
+ return '';
+}
+
+function returnDocument() {
+ return window.document;
+}
+const ALL_HANDLERS = [
+ 'click',
+ 'mousedown',
+ 'touchstart',
+ 'mouseenter',
+ 'mouseleave',
+ 'focus',
+ 'blur',
+ 'contextmenu',
+];
+
+export default {
+ name: 'Trigger',
+ mixins: [BaseMixin],
+ props: {
+ action: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).def([]),
+ showAction: PropTypes.any.def([]),
+ hideAction: PropTypes.any.def([]),
+ getPopupClassNameFromAlign: PropTypes.any.def(returnEmptyString),
+ // onPopupVisibleChange: PropTypes.func.def(noop),
+ afterPopupVisibleChange: PropTypes.func.def(noop),
+ popup: PropTypes.any,
+ popupStyle: PropTypes.object.def(() => ({})),
+ prefixCls: PropTypes.string.def('rc-trigger-popup'),
+ popupClassName: PropTypes.string.def(''),
+ popupPlacement: PropTypes.string,
+ builtinPlacements: PropTypes.object,
+ popupTransitionName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+ popupAnimation: PropTypes.any,
+ mouseEnterDelay: PropTypes.number.def(0),
+ mouseLeaveDelay: PropTypes.number.def(0.1),
+ zIndex: PropTypes.number,
+ focusDelay: PropTypes.number.def(0),
+ blurDelay: PropTypes.number.def(0.15),
+ getPopupContainer: PropTypes.func,
+ getDocument: PropTypes.func.def(returnDocument),
+ forceRender: PropTypes.bool,
+ destroyPopupOnHide: PropTypes.bool.def(false),
+ mask: PropTypes.bool.def(false),
+ maskClosable: PropTypes.bool.def(true),
+ // onPopupAlign: PropTypes.func.def(noop),
+ popupAlign: PropTypes.object.def(() => ({})),
+ popupVisible: PropTypes.bool,
+ defaultPopupVisible: PropTypes.bool.def(false),
+ maskTransitionName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
+ maskAnimation: PropTypes.string,
+ stretch: PropTypes.string,
+ alignPoint: PropTypes.bool, // Maybe we can support user pass position in the future
+ },
+ provide() {
+ return {
+ vcTriggerContext: this,
+ };
+ },
+ inject: {
+ vcTriggerContext: { default: () => ({}) },
+ savePopupRef: { default: () => noop },
+ dialogContext: { default: () => null },
+ },
+ data() {
+ const props = this.$props;
+ let popupVisible;
+ if (hasProp(this, 'popupVisible')) {
+ popupVisible = !!props.popupVisible;
+ } else {
+ popupVisible = !!props.defaultPopupVisible;
+ }
+ ALL_HANDLERS.forEach(h => {
+ this[`fire${h}`] = e => {
+ this.fireEvents(h, e);
+ };
+ });
+ return {
+ prevPopupVisible: popupVisible,
+ sPopupVisible: popupVisible,
+ point: null,
+ };
+ },
+ watch: {
+ popupVisible(val) {
+ if (val !== undefined) {
+ this.prevPopupVisible = this.sPopupVisible;
+ this.sPopupVisible = val;
+ }
+ },
+ },
+ deactivated() {
+ this.setPopupVisible(false);
+ },
+ mounted() {
+ this.$nextTick(() => {
+ this.updatedCal();
+ });
+ },
+
+ updated() {
+ this.$nextTick(() => {
+ this.updatedCal();
+ });
+ },
+
+ beforeDestroy() {
+ this.clearDelayTimer();
+ this.clearOutsideHandler();
+ clearTimeout(this.mouseDownTimeout);
+ },
+ methods: {
+ updatedCal() {
+ const props = this.$props;
+ const state = this.$data;
+
+ // We must listen to `mousedown` or `touchstart`, edge case:
+ // https://github.com/ant-design/ant-design/issues/5804
+ // https://github.com/react-component/calendar/issues/250
+ // https://github.com/react-component/trigger/issues/50
+ if (state.sPopupVisible) {
+ let currentDocument;
+ if (!this.clickOutsideHandler && (this.isClickToHide() || this.isContextmenuToShow())) {
+ currentDocument = props.getDocument();
+ this.clickOutsideHandler = addEventListener(
+ currentDocument,
+ 'mousedown',
+ this.onDocumentClick,
+ );
+ }
+ // always hide on mobile
+ if (!this.touchOutsideHandler) {
+ currentDocument = currentDocument || props.getDocument();
+ this.touchOutsideHandler = addEventListener(
+ currentDocument,
+ 'touchstart',
+ this.onDocumentClick,
+ );
+ }
+ // close popup when trigger type contains 'onContextmenu' and document is scrolling.
+ if (!this.contextmenuOutsideHandler1 && this.isContextmenuToShow()) {
+ currentDocument = currentDocument || props.getDocument();
+ this.contextmenuOutsideHandler1 = addEventListener(
+ currentDocument,
+ 'scroll',
+ this.onContextmenuClose,
+ );
+ }
+ // close popup when trigger type contains 'onContextmenu' and window is blur.
+ if (!this.contextmenuOutsideHandler2 && this.isContextmenuToShow()) {
+ this.contextmenuOutsideHandler2 = addEventListener(
+ window,
+ 'blur',
+ this.onContextmenuClose,
+ );
+ }
+ } else {
+ this.clearOutsideHandler();
+ }
+ },
+ onMouseenter(e) {
+ const { mouseEnterDelay } = this.$props;
+ this.fireEvents('mouseenter', e);
+ this.delaySetPopupVisible(true, mouseEnterDelay, mouseEnterDelay ? null : e);
+ },
+
+ onMouseMove(e) {
+ this.fireEvents('mousemove', e);
+ this.setPoint(e);
+ },
+
+ onMouseleave(e) {
+ this.fireEvents('mouseleave', e);
+ this.delaySetPopupVisible(false, this.$props.mouseLeaveDelay);
+ },
+
+ onPopupMouseenter() {
+ this.clearDelayTimer();
+ },
+
+ onPopupMouseleave(e) {
+ if (
+ e &&
+ e.relatedTarget &&
+ !e.relatedTarget.setTimeout &&
+ this._component &&
+ this._component.getPopupDomNode &&
+ contains(this._component.getPopupDomNode(), e.relatedTarget)
+ ) {
+ return;
+ }
+ this.delaySetPopupVisible(false, this.$props.mouseLeaveDelay);
+ },
+
+ onFocus(e) {
+ this.fireEvents('focus', e);
+ // incase focusin and focusout
+ this.clearDelayTimer();
+ if (this.isFocusToShow()) {
+ this.focusTime = Date.now();
+ this.delaySetPopupVisible(true, this.$props.focusDelay);
+ }
+ },
+
+ onMousedown(e) {
+ this.fireEvents('mousedown', e);
+ this.preClickTime = Date.now();
+ },
+
+ onTouchstart(e) {
+ this.fireEvents('touchstart', e);
+ this.preTouchTime = Date.now();
+ },
+
+ onBlur(e) {
+ if (!contains(e.target, e.relatedTarget || document.activeElement)) {
+ this.fireEvents('blur', e);
+ this.clearDelayTimer();
+ if (this.isBlurToHide()) {
+ this.delaySetPopupVisible(false, this.$props.blurDelay);
+ }
+ }
+ },
+
+ onContextmenu(e) {
+ e.preventDefault();
+ this.fireEvents('contextmenu', e);
+ this.setPopupVisible(true, e);
+ },
+
+ onContextmenuClose() {
+ if (this.isContextmenuToShow()) {
+ this.close();
+ }
+ },
+
+ onClick(event) {
+ this.fireEvents('click', event);
+ // focus will trigger click
+ if (this.focusTime) {
+ let preTime;
+ if (this.preClickTime && this.preTouchTime) {
+ preTime = Math.min(this.preClickTime, this.preTouchTime);
+ } else if (this.preClickTime) {
+ preTime = this.preClickTime;
+ } else if (this.preTouchTime) {
+ preTime = this.preTouchTime;
+ }
+ if (Math.abs(preTime - this.focusTime) < 20) {
+ return;
+ }
+ this.focusTime = 0;
+ }
+ this.preClickTime = 0;
+ this.preTouchTime = 0;
+ // Only prevent default when all the action is click.
+ // https://github.com/ant-design/ant-design/issues/17043
+ // https://github.com/ant-design/ant-design/issues/17291
+ if (
+ this.isClickToShow() &&
+ (this.isClickToHide() || this.isBlurToHide()) &&
+ event &&
+ event.preventDefault
+ ) {
+ event.preventDefault();
+ }
+ if (event && event.domEvent) {
+ event.domEvent.preventDefault();
+ }
+ const nextVisible = !this.$data.sPopupVisible;
+ if ((this.isClickToHide() && !nextVisible) || (nextVisible && this.isClickToShow())) {
+ this.setPopupVisible(!this.$data.sPopupVisible, event);
+ }
+ },
+ onPopupMouseDown(...args) {
+ const { vcTriggerContext = {} } = this;
+ this.hasPopupMouseDown = true;
+
+ clearTimeout(this.mouseDownTimeout);
+ this.mouseDownTimeout = setTimeout(() => {
+ this.hasPopupMouseDown = false;
+ }, 0);
+
+ if (vcTriggerContext.onPopupMouseDown) {
+ vcTriggerContext.onPopupMouseDown(...args);
+ }
+ },
+
+ onDocumentClick(event) {
+ if (this.$props.mask && !this.$props.maskClosable) {
+ return;
+ }
+ const target = event.target;
+ const root = this.$el;
+ if (!contains(root, target) && !this.hasPopupMouseDown) {
+ this.close();
+ }
+ },
+ getPopupDomNode() {
+ if (this._component && this._component.getPopupDomNode) {
+ return this._component.getPopupDomNode();
+ }
+ return null;
+ },
+
+ getRootDomNode() {
+ return this.$el;
+ // return this.$el.children[0] || this.$el
+ },
+
+ handleGetPopupClassFromAlign(align) {
+ const className = [];
+ const props = this.$props;
+ const {
+ popupPlacement,
+ builtinPlacements,
+ prefixCls,
+ alignPoint,
+ getPopupClassNameFromAlign,
+ } = props;
+ if (popupPlacement && builtinPlacements) {
+ className.push(getAlignPopupClassName(builtinPlacements, prefixCls, align, alignPoint));
+ }
+ if (getPopupClassNameFromAlign) {
+ className.push(getPopupClassNameFromAlign(align));
+ }
+ return className.join(' ');
+ },
+
+ getPopupAlign() {
+ const props = this.$props;
+ const { popupPlacement, popupAlign, builtinPlacements } = props;
+ if (popupPlacement && builtinPlacements) {
+ return getAlignFromPlacement(builtinPlacements, popupPlacement, popupAlign);
+ }
+ return popupAlign;
+ },
+ savePopup(node) {
+ this._component = node;
+ this.savePopupRef(node);
+ },
+ getComponent() {
+ const self = this;
+ const mouseProps = {};
+ if (this.isMouseEnterToShow()) {
+ mouseProps.mouseenter = self.onPopupMouseenter;
+ }
+ if (this.isMouseLeaveToHide()) {
+ mouseProps.mouseleave = self.onPopupMouseleave;
+ }
+ mouseProps.mousedown = this.onPopupMouseDown;
+ mouseProps.touchstart = this.onPopupMouseDown;
+ const { handleGetPopupClassFromAlign, getRootDomNode, getContainer } = self;
+ const {
+ prefixCls,
+ destroyPopupOnHide,
+ popupClassName,
+ action,
+ popupAnimation,
+ popupTransitionName,
+ popupStyle,
+ mask,
+ maskAnimation,
+ maskTransitionName,
+ zIndex,
+ stretch,
+ alignPoint,
+ } = self.$props;
+ const { sPopupVisible, point } = this.$data;
+ const align = this.getPopupAlign();
+ const popupProps = {
+ props: {
+ prefixCls,
+ destroyPopupOnHide,
+ visible: sPopupVisible,
+ point: alignPoint && point,
+ action,
+ align,
+ animation: popupAnimation,
+ getClassNameFromAlign: handleGetPopupClassFromAlign,
+ stretch,
+ getRootDomNode,
+ mask,
+ zIndex,
+ transitionName: popupTransitionName,
+ maskAnimation,
+ maskTransitionName,
+ getContainer,
+ popupClassName,
+ popupStyle,
+ },
+ on: {
+ align: getListeners(this).popupAlign || noop,
+ ...mouseProps,
+ },
+ directives: [
+ {
+ name: 'ant-ref',
+ value: this.savePopup,
+ },
+ ],
+ };
+ return {getComponentFromProp(self, 'popup')} ;
+ },
+
+ getContainer() {
+ const { $props: props, dialogContext } = this;
+ const popupContainer = document.createElement('div');
+ // Make sure default popup container will never cause scrollbar appearing
+ // https://github.com/react-component/trigger/issues/41
+ popupContainer.style.position = 'absolute';
+ popupContainer.style.top = '0';
+ popupContainer.style.left = '0';
+ popupContainer.style.width = '100%';
+ const mountNode = props.getPopupContainer
+ ? props.getPopupContainer(this.$el, dialogContext)
+ : props.getDocument().body;
+ mountNode.appendChild(popupContainer);
+ this.popupContainer = popupContainer;
+ return popupContainer;
+ },
+
+ setPopupVisible(sPopupVisible, event) {
+ const { alignPoint, sPopupVisible: prevPopupVisible } = this;
+ this.clearDelayTimer();
+ if (prevPopupVisible !== sPopupVisible) {
+ if (!hasProp(this, 'popupVisible')) {
+ this.setState({
+ sPopupVisible,
+ prevPopupVisible,
+ });
+ }
+ const listeners = getListeners(this);
+ listeners.popupVisibleChange && listeners.popupVisibleChange(sPopupVisible);
+ }
+ // Always record the point position since mouseEnterDelay will delay the show
+ if (alignPoint && event) {
+ this.setPoint(event);
+ }
+ },
+
+ setPoint(point) {
+ const { alignPoint } = this.$props;
+ if (!alignPoint || !point) return;
+
+ this.setState({
+ point: {
+ pageX: point.pageX,
+ pageY: point.pageY,
+ },
+ });
+ },
+ handlePortalUpdate() {
+ if (this.prevPopupVisible !== this.sPopupVisible) {
+ this.afterPopupVisibleChange(this.sPopupVisible);
+ }
+ },
+ delaySetPopupVisible(visible, delayS, event) {
+ const delay = delayS * 1000;
+ this.clearDelayTimer();
+ if (delay) {
+ const point = event ? { pageX: event.pageX, pageY: event.pageY } : null;
+ this.delayTimer = requestAnimationTimeout(() => {
+ this.setPopupVisible(visible, point);
+ this.clearDelayTimer();
+ }, delay);
+ } else {
+ this.setPopupVisible(visible, event);
+ }
+ },
+
+ clearDelayTimer() {
+ if (this.delayTimer) {
+ cancelAnimationTimeout(this.delayTimer);
+ this.delayTimer = null;
+ }
+ },
+
+ clearOutsideHandler() {
+ if (this.clickOutsideHandler) {
+ this.clickOutsideHandler.remove();
+ this.clickOutsideHandler = null;
+ }
+
+ if (this.contextmenuOutsideHandler1) {
+ this.contextmenuOutsideHandler1.remove();
+ this.contextmenuOutsideHandler1 = null;
+ }
+
+ if (this.contextmenuOutsideHandler2) {
+ this.contextmenuOutsideHandler2.remove();
+ this.contextmenuOutsideHandler2 = null;
+ }
+
+ if (this.touchOutsideHandler) {
+ this.touchOutsideHandler.remove();
+ this.touchOutsideHandler = null;
+ }
+ },
+
+ createTwoChains(event) {
+ let fn = () => {};
+ const events = getListeners(this);
+ if (this.childOriginEvents[event] && events[event]) {
+ return this[`fire${event}`];
+ }
+ fn = this.childOriginEvents[event] || events[event] || fn;
+ return fn;
+ },
+
+ isClickToShow() {
+ const { action, showAction } = this.$props;
+ return action.indexOf('click') !== -1 || showAction.indexOf('click') !== -1;
+ },
+
+ isContextmenuToShow() {
+ const { action, showAction } = this.$props;
+ return action.indexOf('contextmenu') !== -1 || showAction.indexOf('contextmenu') !== -1;
+ },
+
+ isClickToHide() {
+ const { action, hideAction } = this.$props;
+ return action.indexOf('click') !== -1 || hideAction.indexOf('click') !== -1;
+ },
+
+ isMouseEnterToShow() {
+ const { action, showAction } = this.$props;
+ return action.indexOf('hover') !== -1 || showAction.indexOf('mouseenter') !== -1;
+ },
+
+ isMouseLeaveToHide() {
+ const { action, hideAction } = this.$props;
+ return action.indexOf('hover') !== -1 || hideAction.indexOf('mouseleave') !== -1;
+ },
+
+ isFocusToShow() {
+ const { action, showAction } = this.$props;
+ return action.indexOf('focus') !== -1 || showAction.indexOf('focus') !== -1;
+ },
+
+ isBlurToHide() {
+ const { action, hideAction } = this.$props;
+ return action.indexOf('focus') !== -1 || hideAction.indexOf('blur') !== -1;
+ },
+ forcePopupAlign() {
+ if (this.$data.sPopupVisible && this._component && this._component.$refs.alignInstance) {
+ this._component.$refs.alignInstance.forceAlign();
+ }
+ },
+ fireEvents(type, e) {
+ if (this.childOriginEvents[type]) {
+ this.childOriginEvents[type](e);
+ }
+ this.__emit(type, e);
+ },
+
+ close() {
+ this.setPopupVisible(false);
+ },
+ },
+ render() {
+ const { sPopupVisible } = this;
+ const children = filterEmpty(this.$slots.default);
+ const { forceRender, alignPoint } = this.$props;
+
+ if (children.length > 1) {
+ warning(false, 'Trigger $slots.default.length > 1, just support only one default', true);
+ }
+ const child = children[0];
+ this.childOriginEvents = getEvents(child);
+ const newChildProps = {
+ props: {},
+ on: {},
+ key: 'trigger',
+ };
+
+ if (this.isContextmenuToShow()) {
+ newChildProps.on.contextmenu = this.onContextmenu;
+ } else {
+ newChildProps.on.contextmenu = this.createTwoChains('contextmenu');
+ }
+
+ if (this.isClickToHide() || this.isClickToShow()) {
+ newChildProps.on.click = this.onClick;
+ newChildProps.on.mousedown = this.onMousedown;
+ newChildProps.on.touchstart = this.onTouchstart;
+ } else {
+ newChildProps.on.click = this.createTwoChains('click');
+ newChildProps.on.mousedown = this.createTwoChains('mousedown');
+ newChildProps.on.touchstart = this.createTwoChains('onTouchstart');
+ }
+ if (this.isMouseEnterToShow()) {
+ newChildProps.on.mouseenter = this.onMouseenter;
+ if (alignPoint) {
+ newChildProps.on.mousemove = this.onMouseMove;
+ }
+ } else {
+ newChildProps.on.mouseenter = this.createTwoChains('mouseenter');
+ }
+ if (this.isMouseLeaveToHide()) {
+ newChildProps.on.mouseleave = this.onMouseleave;
+ } else {
+ newChildProps.on.mouseleave = this.createTwoChains('mouseleave');
+ }
+
+ if (this.isFocusToShow() || this.isBlurToHide()) {
+ newChildProps.on.focus = this.onFocus;
+ newChildProps.on.blur = this.onBlur;
+ } else {
+ newChildProps.on.focus = this.createTwoChains('focus');
+ newChildProps.on.blur = e => {
+ if (e && (!e.relatedTarget || !contains(e.target, e.relatedTarget))) {
+ this.createTwoChains('blur')(e);
+ }
+ };
+ }
+
+ const trigger = cloneElement(child, newChildProps);
+ let portal;
+ // prevent unmounting after it's rendered
+ if (sPopupVisible || this._component || forceRender) {
+ portal = (
+ 
+
U
We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.
++ We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently. +
We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.
++ We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently. +
~
~
+
+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo. diff --git a/components/drawer/__tests__/__snapshots__/Drawer.test.js.snap b/components/drawer/__tests__/__snapshots__/Drawer.test.js.snap index c09e7b22a..3852ebf72 100644 --- a/components/drawer/__tests__/__snapshots__/Drawer.test.js.snap +++ b/components/drawer/__tests__/__snapshots__/Drawer.test.js.snap @@ -1,7 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Drawer class is test_drawer 1`] = ` -
sub-element align left
sub-element align center
sub-element align right
sub-element monospaced arrangement
sub-element align full
Align Top
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
Align Center
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
Align Bottom
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
col-4
++ col-4 +
￥RMB
￥RMB
Default Size
++ Default Size +
-- Racing car sprays burning fuel into crowd.
- - Japanese princess to wed commoner.
- - Australian walks 100km after outback crash.
- - Man charged over missing wedding girl.
- - Los Angeles battles huge wildfires.
+ -
+ Racing car sprays burning fuel into crowd.
+
+ -
+ Japanese princess to wed commoner.
+
+ -
+ Australian walks 100km after outback crash.
+
+ -
+ Man charged over missing wedding girl.
+
+ -
+ Los Angeles battles huge wildfires.
+
Small Size
++ Small Size +
-- Racing car sprays burning fuel into crowd.
- - Japanese princess to wed commoner.
- - Australian walks 100km after outback crash.
- - Man charged over missing wedding girl.
- - Los Angeles battles huge wildfires.
+ -
+ Racing car sprays burning fuel into crowd.
+
+ -
+ Japanese princess to wed commoner.
+
+ -
+ Australian walks 100km after outback crash.
+
+ -
+ Man charged over missing wedding girl.
+
+ -
+ Los Angeles battles huge wildfires.
+
Large Size
++ Large Size +
-- Racing car sprays burning fuel into crowd.
- - Japanese princess to wed commoner.
- - Australian walks 100km after outback crash.
- - Man charged over missing wedding girl.
- - Los Angeles battles huge wildfires.
+ -
+ Racing car sprays burning fuel into crowd.
+
+ -
+ Japanese princess to wed commoner.
+
+ -
+ Australian walks 100km after outback crash.
+
+ -
+ Man charged over missing wedding girl.
+
+ -
+ Los Angeles battles huge wildfires.
+
-- Option 1
- - Option 2
+ -
+ Option 1
+
+ -
+ Option 2
+
-- Option 3
- - Option 4
+ -
+ Option 3
+
+ -
+ Option 4
+
-- Option 5
- - Option 6
- - Option 7
- - Option 8
+ -
+ Option 5
+
+ -
+ Option 6
+
+ -
+ Option 7
+
+ -
+ Option 8
+
-- Option 1
- - Option 2
- - Option 3
- - Option 4
+ -
+ Option 1
+
+ -
+ Option 2
+
+ -
+ Option 3
+
+ -
+ Option 4
+
-- Option 3
- - Option 4
+ -
+ Option 3
+
+ -
+ Option 4
+
-
Submenu
@@ -170,8 +198,12 @@ exports[`renders ./antdv-demo/docs/menu/demo/theme.md correctly 1`] = `
-
Navigation Three
-- Option 3
- - Option 4
+ -
+ Option 3
+
+ -
+ Option 4
+
-
Submenu
diff --git a/components/menu/index.jsx b/components/menu/index.jsx
index 1fc146582..180d02a0b 100644
--- a/components/menu/index.jsx
+++ b/components/menu/index.jsx
@@ -222,7 +222,8 @@ const Menu = {
const { layoutSiderContext, $slots } = this;
const { collapsedWidth } = layoutSiderContext;
const { getPopupContainer: getContextPopupContainer } = this.configProvider;
- const { prefixCls: customizePrefixCls, theme, getPopupContainer } = this.$props;
+ const props = getOptionProps(this);
+ const { prefixCls: customizePrefixCls, theme, getPopupContainer } = props;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('menu', customizePrefixCls);
const menuMode = this.getRealMenuMode();
@@ -235,7 +236,7 @@ const Menu = {
const menuProps = {
props: {
- ...omit(this.$props, ['inlineCollapsed']),
+ ...omit(props, ['inlineCollapsed']),
getPopupContainer: getPopupContainer || getContextPopupContainer,
openKeys: this.sOpenKeys,
mode: menuMode,
@@ -246,7 +247,7 @@ const Menu = {
select: this.handleSelect,
deselect: this.handleDeselect,
openChange: this.handleOpenChange,
- onMouseenter: this.handleMouseEnter,
+ mouseenter: this.handleMouseEnter,
},
nativeOn: {
transitionend: this.handleTransitionEnd,
diff --git a/components/modal/__tests__/Modal.test.js b/components/modal/__tests__/Modal.test.js
index 759beecbb..066cdff5d 100644
--- a/components/modal/__tests__/Modal.test.js
+++ b/components/modal/__tests__/Modal.test.js
@@ -1,6 +1,7 @@
import { mount } from '@vue/test-utils';
import Modal from '..';
import mountTest from '../../../tests/shared/mountTest';
+import { asyncExpect } from '@/tests/utils';
const ModalTester = {
props: ['footer', 'visible'],
@@ -27,30 +28,43 @@ const ModalTester = {
describe('Modal', () => {
mountTest(Modal);
- it('render correctly', done => {
- const wrapper = mount({
- render() {
- return
- 2017-01-10
+
+ 2017-01-10
+
+