diff --git a/components/carousel/index.jsx b/components/carousel/index.jsx index 859bbaa55..f25b7683b 100644 --- a/components/carousel/index.jsx +++ b/components/carousel/index.jsx @@ -1,6 +1,7 @@ import PropTypes from '../_util/vue-types'; import debounce from 'lodash/debounce'; import { initDefaultProps, getComponentFromProp, filterEmpty } from '../_util/props-util'; +import { ConfigConsumerProps } from '../config-provider'; // matchMedia polyfill for // https://github.com/WickyNilliams/enquire.js/issues/82 @@ -70,13 +71,11 @@ const Carousel = { props: initDefaultProps(CarouselProps, { dots: true, arrows: false, - prefixCls: 'ant-carousel', draggable: false, }), - - // innerSlider: any; - - // private slick: any; + inject: { + configProvider: { default: () => ({}) }, + }, beforeMount() { this.onWindowResized = debounce(this.onWindowResized, 500, { @@ -137,7 +136,10 @@ const Carousel = { props.fade = true; } - let className = props.prefixCls; + + const getPrefixCls = this.configProvider.getPrefixCls || ConfigConsumerProps.getPrefixCls; + let className = getPrefixCls('carousel', props.prefixCls); + if (props.vertical) { className = `${className} ${className}-vertical`; } diff --git a/components/cascader/index.jsx b/components/cascader/index.jsx index 78363c14f..55cef65a0 100644 --- a/components/cascader/index.jsx +++ b/components/cascader/index.jsx @@ -19,6 +19,7 @@ import { import BaseMixin from '../_util/BaseMixin'; import { cloneElement } from '../_util/vnode'; import warning from '../_util/warning'; +import { ConfigConsumerProps } from '../config-provider'; const CascaderOptionType = PropTypes.shape({ value: PropTypes.string, @@ -73,7 +74,7 @@ const CascaderProps = { /** 是否支持清除*/ allowClear: PropTypes.bool.def(true), showSearch: PropTypes.oneOfType([Boolean, ShowSearchType]), - notFoundContent: PropTypes.any.def('Not Found'), + notFoundContent: PropTypes.an, loadData: PropTypes.func, /** 次级菜单的展开方式，可选 'click' 和 'hover' */ expandTrigger: CascaderExpandTrigger, @@ -81,8 +82,8 @@ const CascaderProps = { changeOnSelect: PropTypes.bool, /** 浮层可见变化时回调 */ // onPopupVisibleChange?: (popupVisible: boolean) => void; - prefixCls: PropTypes.string.def('ant-cascader'), - inputPrefixCls: PropTypes.string.def('ant-input'), + prefixCls: PropTypes.string, + inputPrefixCls: PropTypes.string, getPopupContainer: PropTypes.func, popupVisible: PropTypes.bool, fieldNames: FieldNamesType, @@ -285,7 +286,7 @@ const Cascader = { } }, - generateFilteredOptions(prefixCls) { + generateFilteredOptions(prefixCls, renderEmpty) { const { showSearch, notFoundContent, $scopedSlots } = this; const names = getFilledFieldNames(this.$props); const { @@ -335,7 +336,11 @@ const Cascader = { }); } return [ - { [names.label]: notFoundContent, [names.value]: 'ANT_CASCADER_NOT_FOUND', disabled: true }, + { + [names.label]: notFoundContent || renderEmpty('Cascader'), + [names.value]: 'ANT_CASCADER_NOT_FOUND', + disabled: true, + }, ]; }, @@ -364,8 +369,8 @@ const Cascader = { suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon; const { getPopupContainer: getContextPopupContainer } = configProvider; const { - prefixCls, - inputPrefixCls, + prefixCls: customizePrefixCls, + inputPrefixCls: customizeInputPrefixCls, placeholder = localeData.placeholder, size, disabled, @@ -374,6 +379,11 @@ const Cascader = { ...otherProps } = props; + 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); + const sizeCls = classNames({ [`${inputPrefixCls}-lg`]: size === 'large', [`${inputPrefixCls}-sm`]: size === 'small', @@ -423,7 +433,7 @@ const Cascader = { let options = props.options; if (inputValue) { - options = this.generateFilteredOptions(prefixCls); + options = this.generateFilteredOptions(prefixCls, renderEmpty); } // Dropdown menu should keep previous status until it is fully closed. if (!sPopupVisible) { @@ -502,6 +512,7 @@ const Cascader = { ...props, getPopupContainer, options: options, + prefixCls, value: value, popupVisible: sPopupVisible, dropdownMenuColumnStyle: dropdownMenuColumnStyle, diff --git a/components/cascader/style/index.js b/components/cascader/style/index.js index 8d42b2011..b64c64e2f 100644 --- a/components/cascader/style/index.js +++ b/components/cascader/style/index.js @@ -2,5 +2,5 @@ import '../../style/index.less'; import './index.less'; // style dependencies -// import '../../empty/style'; +import '../../empty/style'; import '../../input/style'; diff --git a/components/config-provider/index.jsx b/components/config-provider/index.jsx index c05b7b7f9..d2531967e 100644 --- a/components/config-provider/index.jsx +++ b/components/config-provider/index.jsx @@ -15,11 +15,17 @@ const ConfigProvider = { return { configProvider: { ...this.$props, - renderEmpty: this.$props.renderEmpty || this.$slots.renderEmpty || defaultRenderEmpty, + renderEmpty: this.renderEmptySlots, getPrefixCls: this.getPrefixCls, }, }; }, + computed: { + renderEmptySlots() { + const customRender = (this.$scopedSlots && this.$scopedSlots['renderEmpty']) || this.$slots['renderEmpty']; + return this.$props.renderEmpty || customRender || defaultRenderEmpty; + }, + }, methods: { getPrefixCls(suffixCls, customizePrefixCls) { const { prefixCls = 'ant' } = this.$props; @@ -37,6 +43,7 @@ export const ConfigConsumerProps = { if (customizePrefixCls) return customizePrefixCls; return `ant-${suffixCls}`; }, + renderEmpty: defaultRenderEmpty, }; /* istanbul ignore next */ diff --git a/components/empty/demo/config-provider.md b/components/empty/demo/config-provider.md index 856e842a1..3c859d999 100644 --- a/components/empty/demo/config-provider.md +++ b/components/empty/demo/config-provider.md @@ -20,8 +20,8 @@ Use ConfigProvider set global Empty style. -