ant-design-vue/components/cascader/index.jsx

538 lines
16 KiB
Vue
Raw Normal View History

2019-01-12 11:33:27 +08:00
import PropTypes from '../_util/vue-types';
import VcCascader from '../vc-cascader';
import arrayTreeFilter from 'array-tree-filter';
import classNames from 'classnames';
import omit from 'omit.js';
import KeyCode from '../_util/KeyCode';
import Input from '../input';
import Icon from '../icon';
import {
hasProp,
filterEmpty,
getOptionProps,
getStyle,
getClass,
getAttrs,
getComponentFromProp,
isValidElement,
} from '../_util/props-util';
import BaseMixin from '../_util/BaseMixin';
import { cloneElement } from '../_util/vnode';
import warning from '../_util/warning';
2019-03-14 21:21:58 +08:00
import { ConfigConsumerProps } from '../config-provider';
2018-03-03 19:14:03 +08:00
const CascaderOptionType = PropTypes.shape({
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
value: PropTypes.string,
label: PropTypes.any,
2018-03-03 19:14:03 +08:00
disabled: PropTypes.bool,
children: PropTypes.array,
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
key: PropTypes.string,
2019-01-12 11:33:27 +08:00
}).loose;
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
const FieldNamesType = PropTypes.shape({
value: PropTypes.string.isRequired,
label: PropTypes.string.isRequired,
children: PropTypes.string,
2019-01-12 11:33:27 +08:00
}).loose;
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
2019-01-12 11:33:27 +08:00
const CascaderExpandTrigger = PropTypes.oneOf(['click', 'hover']);
2018-03-03 19:14:03 +08:00
const ShowSearchType = PropTypes.shape({
filter: PropTypes.func,
render: PropTypes.func,
sort: PropTypes.func,
matchInputWidth: PropTypes.bool,
2019-01-03 20:47:39 +08:00
limit: PropTypes.oneOfType([Boolean, Number]),
2019-01-12 11:33:27 +08:00
}).loose;
function noop() {}
2018-03-03 19:14:03 +08:00
const CascaderProps = {
/** 可选项数据源 */
options: PropTypes.arrayOf(CascaderOptionType).def([]),
/** 默认的选中项 */
defaultValue: PropTypes.arrayOf(PropTypes.string),
/** 指定选中项 */
value: PropTypes.arrayOf(PropTypes.string),
/** 选择完成后的回调 */
// onChange?: (value: string[], selectedOptions?: CascaderOptionType[]) => void;
/** 选择后展示的渲染函数 */
displayRender: PropTypes.func,
transitionName: PropTypes.string.def('slide-up'),
popupStyle: PropTypes.object.def({}),
/** 自定义浮层类名 */
popupClassName: PropTypes.string,
/** 浮层预设位置:`bottomLeft` `bottomRight` `topLeft` `topRight` */
2019-01-12 11:33:27 +08:00
popupPlacement: PropTypes.oneOf(['bottomLeft', 'bottomRight', 'topLeft', 'topRight']).def(
'bottomLeft',
),
2018-03-03 19:14:03 +08:00
/** 输入框占位文本*/
placeholder: PropTypes.string.def('Please select'),
/** 输入框大小,可选 `large` `default` `small` */
size: PropTypes.oneOf(['large', 'default', 'small']),
/** 禁用*/
disabled: PropTypes.bool.def(false),
/** 是否支持清除*/
allowClear: PropTypes.bool.def(true),
2018-06-07 14:40:10 +08:00
showSearch: PropTypes.oneOfType([Boolean, ShowSearchType]),
2019-03-14 21:21:58 +08:00
notFoundContent: PropTypes.an,
2018-03-03 19:14:03 +08:00
loadData: PropTypes.func,
/** 次级菜单的展开方式,可选 'click' 和 'hover' */
expandTrigger: CascaderExpandTrigger,
/** 当此项为 true 时,点选每级菜单选项值都会发生变化 */
changeOnSelect: PropTypes.bool,
/** 浮层可见变化时回调 */
// onPopupVisibleChange?: (popupVisible: boolean) => void;
2019-03-14 21:21:58 +08:00
prefixCls: PropTypes.string,
inputPrefixCls: PropTypes.string,
2018-03-03 19:14:03 +08:00
getPopupContainer: PropTypes.func,
popupVisible: PropTypes.bool,
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
fieldNames: FieldNamesType,
2018-06-07 14:40:10 +08:00
autoFocus: PropTypes.bool,
2018-11-29 22:20:17 +08:00
suffixIcon: PropTypes.any,
2019-01-12 11:33:27 +08:00
};
2018-03-03 19:14:03 +08:00
2019-01-03 20:47:39 +08:00
// We limit the filtered item count by default
2019-01-12 11:33:27 +08:00
const defaultLimit = 50;
2019-01-03 20:47:39 +08:00
2019-01-12 11:33:27 +08:00
function defaultFilterOption(inputValue, path, names) {
return path.some(option => option[names.label].indexOf(inputValue) > -1);
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
function defaultSortFilteredOption(a, b, inputValue, names) {
function callback(elem) {
return elem[names.label].indexOf(inputValue) > -1;
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
return a.findIndex(callback) - b.findIndex(callback);
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
function getFilledFieldNames({ fieldNames = {} }) {
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
const names = {
children: fieldNames.children || 'children',
label: fieldNames.label || 'label',
value: fieldNames.value || 'value',
2019-01-12 11:33:27 +08:00
};
return names;
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
}
2019-01-12 11:33:27 +08:00
function flattenTree(options = [], props, ancestor = []) {
const names = getFilledFieldNames(props);
let flattenOptions = [];
const childrenName = names.children;
2019-01-03 20:47:39 +08:00
options.forEach(option => {
2019-01-12 11:33:27 +08:00
const path = ancestor.concat(option);
2019-01-03 20:47:39 +08:00
if (props.changeOnSelect || !option[childrenName] || !option[childrenName].length) {
2019-01-12 11:33:27 +08:00
flattenOptions.push(path);
2019-01-03 20:47:39 +08:00
}
if (option[childrenName]) {
2019-01-12 11:33:27 +08:00
flattenOptions = flattenOptions.concat(flattenTree(option[childrenName], props, path));
2019-01-03 20:47:39 +08:00
}
2019-01-12 11:33:27 +08:00
});
return flattenOptions;
2019-01-03 20:47:39 +08:00
}
2019-01-12 11:33:27 +08:00
const defaultDisplayRender = ({ labels }) => labels.join(' / ');
2018-03-03 19:14:03 +08:00
const Cascader = {
2018-05-06 20:37:39 +08:00
inheritAttrs: false,
2018-04-08 21:17:20 +08:00
name: 'ACascader',
2018-03-03 19:14:03 +08:00
mixins: [BaseMixin],
props: CascaderProps,
2018-03-04 16:02:46 +08:00
model: {
prop: 'value',
event: 'change',
},
2019-01-03 20:47:39 +08:00
inject: {
2019-01-28 21:09:13 +08:00
configProvider: { default: () => ({}) },
localeData: { default: () => ({}) },
2019-01-03 20:47:39 +08:00
},
2019-01-12 11:33:27 +08:00
data() {
this.cachedOptions = [];
const { value, defaultValue, popupVisible, showSearch, options } = this;
2018-03-03 19:14:03 +08:00
return {
sValue: value || defaultValue || [],
inputValue: '',
inputFocused: false,
sPopupVisible: popupVisible,
2018-11-29 22:20:17 +08:00
flattenOptions: showSearch ? flattenTree(options, this.$props) : undefined,
2019-01-12 11:33:27 +08:00
};
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
mounted() {
2018-06-07 14:40:10 +08:00
this.$nextTick(() => {
if (this.autoFocus && !this.showSearch && !this.disabled) {
2019-01-12 11:33:27 +08:00
this.$refs.picker.focus();
2018-06-07 14:40:10 +08:00
}
2019-01-12 11:33:27 +08:00
});
2018-06-07 14:40:10 +08:00
},
2018-03-03 19:14:03 +08:00
watch: {
2019-01-12 11:33:27 +08:00
value(val) {
this.setState({ sValue: val || [] });
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
popupVisible(val) {
this.setState({ sPopupVisible: val });
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
options(val) {
2018-03-03 19:14:03 +08:00
if (this.showSearch) {
2019-01-12 11:33:27 +08:00
this.setState({ flattenOptions: flattenTree(val, this.$props) });
2018-03-03 19:14:03 +08:00
}
},
},
methods: {
2019-01-12 11:33:27 +08:00
highlightKeyword(str, keyword, prefixCls) {
return str
.split(keyword)
.map((node, index) =>
index === 0
? node
: [<span class={`${prefixCls}-menu-item-keyword`}>{keyword}</span>, node],
);
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
defaultRenderFilteredOption({ inputValue, path, prefixCls, names }) {
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
return path.map((option, index) => {
2019-01-12 11:33:27 +08:00
const label = option[names.label];
const node =
label.indexOf(inputValue) > -1
? this.highlightKeyword(label, inputValue, prefixCls)
: label;
return index === 0 ? node : [' / ', node];
});
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
handleChange(value, selectedOptions) {
this.setState({ inputValue: '' });
2018-03-03 19:14:03 +08:00
if (selectedOptions[0].__IS_FILTERED_OPTION) {
2019-01-12 11:33:27 +08:00
const unwrappedValue = value[0];
const unwrappedSelectedOptions = selectedOptions[0].path;
this.setValue(unwrappedValue, unwrappedSelectedOptions);
return;
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
this.setValue(value, selectedOptions);
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
handlePopupVisibleChange(popupVisible) {
2018-03-03 19:14:03 +08:00
if (!hasProp(this, 'popupVisible')) {
2019-01-03 20:47:39 +08:00
this.setState(state => ({
2018-03-03 19:14:03 +08:00
sPopupVisible: popupVisible,
inputFocused: popupVisible,
2019-01-03 20:47:39 +08:00
inputValue: popupVisible ? state.inputValue : '',
2019-01-12 11:33:27 +08:00
}));
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
this.$emit('popupVisibleChange', popupVisible);
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
handleInputFocus(e) {
this.$emit('focus', e);
2018-06-07 14:40:10 +08:00
},
2018-03-03 19:14:03 +08:00
2019-01-12 11:33:27 +08:00
handleInputBlur(e) {
2018-03-03 19:14:03 +08:00
this.setState({
inputFocused: false,
2019-01-12 11:33:27 +08:00
});
this.$emit('blur', e);
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
handleInputClick(e) {
const { inputFocused, sPopupVisible } = this;
2018-03-03 19:14:03 +08:00
// Prevent `Trigger` behaviour.
if (inputFocused || sPopupVisible) {
2019-01-12 11:33:27 +08:00
e.stopPropagation();
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
if (e.nativeEvent && e.nativeEvent.stopImmediatePropagation) {
2019-01-12 11:33:27 +08:00
e.nativeEvent.stopImmediatePropagation();
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
}
2018-03-03 19:14:03 +08:00
}
},
2019-01-12 11:33:27 +08:00
handleKeyDown(e) {
2018-03-03 19:14:03 +08:00
if (e.keyCode === KeyCode.BACKSPACE) {
2019-01-12 11:33:27 +08:00
e.stopPropagation();
2018-03-03 19:14:03 +08:00
}
},
2019-01-12 11:33:27 +08:00
handleInputChange(e) {
const inputValue = e.target.value;
this.setState({ inputValue });
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
setValue(value, selectedOptions) {
2018-03-03 19:14:03 +08:00
if (!hasProp(this, 'value')) {
2019-01-12 11:33:27 +08:00
this.setState({ sValue: value });
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
this.$emit('change', value, selectedOptions);
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
getLabel() {
const { options, $scopedSlots } = this;
const names = getFilledFieldNames(this.$props);
const displayRender =
this.displayRender || $scopedSlots.displayRender || defaultDisplayRender;
const value = this.sValue;
const unwrappedValue = Array.isArray(value[0]) ? value[0] : value;
const selectedOptions = arrayTreeFilter(
options,
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
(o, level) => o[names.value] === unwrappedValue[level],
{ childrenKeyName: names.children },
2019-01-12 11:33:27 +08:00
);
const labels = selectedOptions.map(o => o[names.label]);
return displayRender({ labels, selectedOptions });
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
clearSelection(e) {
e.preventDefault();
e.stopPropagation();
2018-03-03 19:14:03 +08:00
if (!this.inputValue) {
2019-01-12 11:33:27 +08:00
this.setValue([]);
this.handlePopupVisibleChange(false);
2018-03-03 19:14:03 +08:00
} else {
2019-01-12 11:33:27 +08:00
this.setState({ inputValue: '' });
2018-03-03 19:14:03 +08:00
}
},
2019-03-14 21:21:58 +08:00
generateFilteredOptions(prefixCls, renderEmpty) {
2019-01-12 11:33:27 +08:00
const { showSearch, notFoundContent, $scopedSlots } = this;
const names = getFilledFieldNames(this.$props);
2018-03-03 19:14:03 +08:00
const {
filter = defaultFilterOption,
2018-03-04 17:11:32 +08:00
// render = this.defaultRenderFilteredOption,
2018-03-03 19:14:03 +08:00
sort = defaultSortFilteredOption,
2019-01-03 20:47:39 +08:00
limit = defaultLimit,
2019-01-12 11:33:27 +08:00
} = showSearch;
const render =
showSearch.render || $scopedSlots.showSearchRender || this.defaultRenderFilteredOption;
const { flattenOptions = [], inputValue } = this.$data;
2019-01-03 20:47:39 +08:00
// Limit the filter if needed
2019-01-12 11:33:27 +08:00
let filtered;
2019-01-03 20:47:39 +08:00
if (limit > 0) {
2019-01-12 11:33:27 +08:00
filtered = [];
let matchCount = 0;
2019-01-03 20:47:39 +08:00
// Perf optimization to filter items only below the limit
flattenOptions.some(path => {
2019-01-12 11:33:27 +08:00
const match = filter(inputValue, path, names);
2019-01-03 20:47:39 +08:00
if (match) {
2019-01-12 11:33:27 +08:00
filtered.push(path);
matchCount += 1;
2019-01-03 20:47:39 +08:00
}
2019-01-12 11:33:27 +08:00
return matchCount >= limit;
});
2019-01-03 20:47:39 +08:00
} else {
warning(
typeof limit !== 'number',
"'limit' of showSearch in Cascader should be positive number or false.",
2019-01-12 11:33:27 +08:00
);
filtered = flattenOptions.filter(path => filter(inputValue, path, names));
2019-01-03 20:47:39 +08:00
}
2019-01-12 11:33:27 +08:00
filtered.sort((a, b) => sort(a, b, inputValue, names));
2018-03-03 19:14:03 +08:00
if (filtered.length > 0) {
2019-01-12 11:33:27 +08:00
return filtered.map(path => {
2018-03-03 19:14:03 +08:00
return {
__IS_FILTERED_OPTION: true,
path,
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
[names.label]: render({ inputValue, path, prefixCls, names }),
2019-01-12 11:33:27 +08:00
[names.value]: path.map(o => o[names.value]),
disabled: path.some(o => !!o.disabled),
};
});
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
return [
2019-03-14 21:21:58 +08:00
{
[names.label]: notFoundContent || renderEmpty('Cascader'),
[names.value]: 'ANT_CASCADER_NOT_FOUND',
disabled: true,
},
2019-01-12 11:33:27 +08:00
];
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
focus() {
2018-06-07 14:40:10 +08:00
if (this.showSearch) {
2019-01-12 11:33:27 +08:00
this.$refs.input.focus();
2018-06-07 14:40:10 +08:00
} else {
2019-01-12 11:33:27 +08:00
this.$refs.picker.focus();
2018-06-07 14:40:10 +08:00
}
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
blur() {
2018-06-07 14:40:10 +08:00
if (this.showSearch) {
2019-01-12 11:33:27 +08:00
this.$refs.input.blur();
2018-06-07 14:40:10 +08:00
} else {
2019-01-12 11:33:27 +08:00
this.$refs.picker.blur();
2018-06-07 14:40:10 +08:00
}
2018-03-03 19:14:03 +08:00
},
},
2019-01-12 11:33:27 +08:00
render() {
const { $slots, sPopupVisible, inputValue, $listeners, configProvider, localeData } = this;
const { sValue: value, inputFocused } = this.$data;
const props = getOptionProps(this);
let suffixIcon = getComponentFromProp(this, 'suffixIcon');
suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon;
const { getPopupContainer: getContextPopupContainer } = configProvider;
2018-03-03 19:14:03 +08:00
const {
2019-03-14 21:21:58 +08:00
prefixCls: customizePrefixCls,
inputPrefixCls: customizeInputPrefixCls,
2019-01-03 20:47:39 +08:00
placeholder = localeData.placeholder,
size,
disabled,
allowClear,
showSearch = false,
...otherProps
2019-01-12 11:33:27 +08:00
} = props;
2018-03-03 19:14:03 +08:00
2019-03-14 21:21:58 +08:00
const getPrefixCls = this.configProvider.getPrefixCls || ConfigConsumerProps.getPrefixCls;
const renderEmpty = this.configProvider.renderEmpty || ((componentName) => ConfigConsumerProps.renderEmpty(componentName));
const prefixCls = getPrefixCls('cascader', customizePrefixCls);
const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls);
2018-03-03 19:14:03 +08:00
const sizeCls = classNames({
[`${inputPrefixCls}-lg`]: size === 'large',
[`${inputPrefixCls}-sm`]: size === 'small',
2019-01-12 11:33:27 +08:00
});
const clearIcon =
(allowClear && !disabled && value.length > 0) || inputValue ? (
<Icon
type="close-circle"
theme="filled"
class={`${prefixCls}-picker-clear`}
onClick={this.clearSelection}
key="clear-icon"
/>
) : null;
2018-03-03 19:14:03 +08:00
const arrowCls = classNames({
[`${prefixCls}-picker-arrow`]: true,
[`${prefixCls}-picker-arrow-expand`]: sPopupVisible,
2019-01-12 11:33:27 +08:00
});
const pickerCls = classNames(getClass(this), `${prefixCls}-picker`, {
[`${prefixCls}-picker-with-value`]: inputValue,
[`${prefixCls}-picker-disabled`]: disabled,
[`${prefixCls}-picker-${size}`]: !!size,
[`${prefixCls}-picker-show-search`]: !!showSearch,
[`${prefixCls}-picker-focused`]: inputFocused,
});
2018-03-03 19:14:03 +08:00
// Fix bug of https://github.com/facebook/react/pull/5004
// and https://fb.me/react-unknown-prop
const tempInputProps = omit(otherProps, [
'options',
'popupPlacement',
'transitionName',
'displayRender',
'changeOnSelect',
'expandTrigger',
'popupVisible',
'getPopupContainer',
'loadData',
'popupClassName',
'filterOption',
'renderFilteredOption',
'sortFilteredOption',
'notFoundContent',
2018-03-04 16:02:46 +08:00
'defaultValue',
update to antd3.8.3 (#159) * refactor: align * feat: update align to 2.4.3 * feat: update trigger 2.5.4 * feat: update tooltip 3.7.2 * fix: align * feat: update vc-calendar to 9.6.2 * feat: update vc-checkbox to 2.1.5 * feat: update vc-dialog to 7.1.8 * feat: update vc-from to 2.2.1 * feat: update vc-notification to 3.1.1 * test: update snapshots * feat: update vc-tree to 1.12.6 * feat: update vc-table to 6.2.8 * feat: update vc-upload to 2.5.1 * feat: update vc-input-number to 4.0.12 * feat: update vc-tabs to 9.2.6 * refactor: vc-menu * refactor: update vc-menu to 7.0.5 * style: remove unused * feat: update pagination to 1.16.5 * feat: add vc-progress 2.2.5 tag * feat: add vc-rate 2.4.0 tag * feat: update vc-slider to 8.6.1 * fix: tooltip error * style: delete conosle * feat: update vc-steps to 3.1.1 * add vc-switch tag 1.6.0 * feat: update upload to 2.5.1 * fix: update vc-menu * fix: update store * fix: add ref dir * fix: trigger mock shouldComponentUpdate * fix: update vc-select * revert: trigger lazyrenderbox * fix: update vc-select * fix: update vc-select * fix: update vc-select * fix: update vc-menu * fix: update vc-slick ref * update style to 3.8.2 * test: update snapshots * update vc-select * update util & affix * feat: add drawer * fix: support title add slot mode * test: update affix test * update alert * update anchor * update snapshots * fix: doc and vc-drawer * update select & auto-complete * update back-top & grid * feractor: avatar * test: add drawer test * update badge * update button * update card * update divider * feat: update vc-tabs to 9.3.6 and tabs * add afterEnter callback * update form * fix: update drawer * test: update snapshots * update modal & notification * test: update snapshots * update message * update locale-provider * update dropdown * update layout popconfirm popover * update time-picker * update menu * update date-picker * docs: update input docs * update input * update snapshots * update table * update test snapshots * feat: update progress * update checkbox * feat: update spin * update radio * docs: slider steps timeline * update list * update transfer * update collapse * update cascader * update upload
2018-09-05 21:28:54 +08:00
'fieldNames',
2019-01-12 11:33:27 +08:00
]);
2018-03-03 19:14:03 +08:00
2019-01-12 11:33:27 +08:00
let options = props.options;
2018-03-03 19:14:03 +08:00
if (inputValue) {
2019-03-14 21:21:58 +08:00
options = this.generateFilteredOptions(prefixCls, renderEmpty);
2018-03-03 19:14:03 +08:00
}
// Dropdown menu should keep previous status until it is fully closed.
if (!sPopupVisible) {
2019-01-12 11:33:27 +08:00
options = this.cachedOptions;
2018-03-03 19:14:03 +08:00
} else {
2019-01-12 11:33:27 +08:00
this.cachedOptions = options;
2018-03-03 19:14:03 +08:00
}
2019-01-12 11:33:27 +08:00
const dropdownMenuColumnStyle = {};
const isNotFound =
(options || []).length === 1 && options[0].value === 'ANT_CASCADER_NOT_FOUND';
2018-03-03 19:14:03 +08:00
if (isNotFound) {
2019-01-12 11:33:27 +08:00
dropdownMenuColumnStyle.height = 'auto'; // Height of one row.
2018-03-03 19:14:03 +08:00
}
// The default value of `matchInputWidth` is `true`
2019-01-12 11:33:27 +08:00
const resultListMatchInputWidth = showSearch.matchInputWidth !== false;
2018-03-03 19:14:03 +08:00
if (resultListMatchInputWidth && inputValue && this.input) {
2019-01-12 11:33:27 +08:00
dropdownMenuColumnStyle.width = this.input.input.offsetWidth;
2018-03-03 19:14:03 +08:00
}
2018-06-07 14:40:10 +08:00
// showSearch时focus、blur在input上触发反之在ref='picker'上触发
2018-03-03 19:14:03 +08:00
const inputProps = {
props: {
...tempInputProps,
prefixCls: inputPrefixCls,
placeholder: value && value.length > 0 ? undefined : placeholder,
value: inputValue,
disabled: disabled,
readOnly: !showSearch,
autoComplete: 'off',
},
class: `${prefixCls}-input ${sizeCls}`,
ref: 'input',
on: {
2018-06-07 14:40:10 +08:00
focus: showSearch ? this.handleInputFocus : noop,
2018-03-03 19:14:03 +08:00
click: showSearch ? this.handleInputClick : noop,
blur: showSearch ? this.handleInputBlur : noop,
keydown: this.handleKeyDown,
change: showSearch ? this.handleInputChange : noop,
},
2018-05-06 20:37:39 +08:00
attrs: getAttrs(this),
2019-01-12 11:33:27 +08:00
};
const children = filterEmpty($slots.default);
const inputIcon = (suffixIcon &&
(isValidElement(suffixIcon) ? (
cloneElement(suffixIcon, {
class: {
[`${prefixCls}-picker-arrow`]: true,
2018-11-29 22:20:17 +08:00
},
2019-01-12 11:33:27 +08:00
})
) : (
<span class={`${prefixCls}-picker-arrow`}>{suffixIcon}</span>
))) || <Icon type="down" class={arrowCls} />;
const input = children.length ? (
children
) : (
<span class={pickerCls} style={getStyle(this)} ref="picker">
{showSearch ? <span class={`${prefixCls}-picker-label`}>{this.getLabel()}</span> : null}
<Input {...inputProps} />
{!showSearch ? <span class={`${prefixCls}-picker-label`}>{this.getLabel()}</span> : null}
2018-03-03 19:14:03 +08:00
{clearIcon}
2018-11-29 22:20:17 +08:00
{inputIcon}
</span>
2019-01-12 11:33:27 +08:00
);
2018-11-29 22:20:17 +08:00
2019-01-12 11:33:27 +08:00
const expandIcon = <Icon type="right" />;
2018-11-29 22:20:17 +08:00
const loadingIcon = (
<span class={`${prefixCls}-menu-item-loading-icon`}>
2019-01-12 11:33:27 +08:00
<Icon type="redo" spin />
2018-03-03 19:14:03 +08:00
</span>
2019-01-12 11:33:27 +08:00
);
const getPopupContainer = props.getPopupContainer || getContextPopupContainer;
2018-03-03 19:14:03 +08:00
const cascaderProps = {
props: {
...props,
2019-01-03 20:47:39 +08:00
getPopupContainer,
2018-03-03 19:14:03 +08:00
options: options,
2019-03-14 21:21:58 +08:00
prefixCls,
2018-03-03 19:14:03 +08:00
value: value,
popupVisible: sPopupVisible,
dropdownMenuColumnStyle: dropdownMenuColumnStyle,
2018-11-29 22:20:17 +08:00
expandIcon,
loadingIcon,
2018-03-03 19:14:03 +08:00
},
on: {
2018-06-07 14:40:10 +08:00
...$listeners,
2018-03-03 19:14:03 +08:00
popupVisibleChange: this.handlePopupVisibleChange,
change: this.handleChange,
},
2019-01-12 11:33:27 +08:00
};
return <VcCascader {...cascaderProps}>{input}</VcCascader>;
2018-03-03 19:14:03 +08:00
},
2019-01-12 11:33:27 +08:00
};
2018-03-03 19:14:03 +08:00
/* istanbul ignore next */
2019-01-12 11:33:27 +08:00
Cascader.install = function(Vue) {
Vue.component(Cascader.name, Cascader);
};
2019-01-12 11:33:27 +08:00
export default Cascader;