diff --git a/components/cascader/index.jsx b/components/cascader/index.jsx index 55cef65a0..11a13db98 100644 --- a/components/cascader/index.jsx +++ b/components/cascader/index.jsx @@ -287,6 +287,7 @@ const Cascader = { }, generateFilteredOptions(prefixCls, renderEmpty) { + const h = this.$createElement; const { showSearch, notFoundContent, $scopedSlots } = this; const names = getFilledFieldNames(this.$props); const { @@ -337,7 +338,7 @@ const Cascader = { } return [ { - [names.label]: notFoundContent || renderEmpty('Cascader'), + [names.label]: notFoundContent || renderEmpty(h, 'Cascader'), [names.value]: 'ANT_CASCADER_NOT_FOUND', disabled: true, }, @@ -378,9 +379,11 @@ const Cascader = { showSearch = false, ...otherProps } = props; - const getPrefixCls = this.configProvider.getPrefixCls || ConfigConsumerProps.getPrefixCls; - const renderEmpty = this.configProvider.renderEmpty || ((componentName) => ConfigConsumerProps.renderEmpty(componentName)); + const renderEmpty = ( + this.configProvider.renderEmptyComponent && + this.configProvider.renderEmptyComponent() + ) || ConfigConsumerProps.renderEmpty; const prefixCls = getPrefixCls('cascader', customizePrefixCls); const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls); @@ -450,8 +453,8 @@ const Cascader = { } // The default value of `matchInputWidth` is `true` const resultListMatchInputWidth = showSearch.matchInputWidth !== false; - if (resultListMatchInputWidth && inputValue && this.input) { - dropdownMenuColumnStyle.width = this.input.input.offsetWidth; + if (resultListMatchInputWidth && inputValue && this.$refs.input) { + dropdownMenuColumnStyle.width = this.$refs.input.$el.offsetWidth + 'px'; } // showSearch时,focus、blur在input上触发,反之在ref='picker'上触发 const inputProps = { diff --git a/components/config-provider/empty.svg b/components/config-provider/empty.svg index 55e40af09..0ce1dcebc 100644 --- a/components/config-provider/empty.svg +++ b/components/config-provider/empty.svg @@ -1,16 +1,9 @@ - - - - - - - - - - - - - + + + + + + diff --git a/components/config-provider/index.jsx b/components/config-provider/index.jsx index d2531967e..1c55c1f43 100644 --- a/components/config-provider/index.jsx +++ b/components/config-provider/index.jsx @@ -13,20 +13,14 @@ const ConfigProvider = { }, provide() { return { - configProvider: { - ...this.$props, - renderEmpty: this.renderEmptySlots, - getPrefixCls: this.getPrefixCls, - }, + configProvider: this, }; }, - computed: { - renderEmptySlots() { + methods: { + renderEmptyComponent() { 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; if (customizePrefixCls) return customizePrefixCls; diff --git a/components/config-provider/renderEmpty.jsx b/components/config-provider/renderEmpty.jsx index 8d124d20f..ca6f12e5c 100644 --- a/components/config-provider/renderEmpty.jsx +++ b/components/config-provider/renderEmpty.jsx @@ -1,27 +1,31 @@ import PropTypes from '../_util/vue-types'; import Empty from '../empty'; import emptyImg from './empty.svg'; +import { ConfigConsumerProps } from '.'; -const renderEmpty = { +const RenderEmpty = { functional: true, - inject: ['configProvider'], + inject: { + configProvider: { default: () => ({}) }, + }, props: { componentName: PropTypes.string, }, render(createElement, context) { const { props, injections } = context; function renderHtml(componentName) { - const prefix = injections.configProvider.getPrefixCls('empty'); + const getPrefixCls = injections.configProvider.getPrefixCls || ConfigConsumerProps.getPrefixCls; + const prefix = getPrefixCls('empty'); switch (componentName) { case 'Table': case 'List': - return ; + return ; case 'Select': case 'TreeSelect': case 'Cascader': case 'Transfer': - return ; + return ; default: return ; @@ -31,4 +35,8 @@ const renderEmpty = { }, }; +function renderEmpty(h, componentName) { + return ; +} + export default renderEmpty; diff --git a/components/empty/demo/config-provider.md b/components/empty/demo/config-provider.md index 3c859d999..520879843 100644 --- a/components/empty/demo/config-provider.md +++ b/components/empty/demo/config-provider.md @@ -20,7 +20,7 @@ Use ConfigProvider set global Empty style. -

Data Not Found

@@ -54,7 +54,7 @@ Use ConfigProvider set global Empty style. export default { data() { return { - customize: true, + customize: false, style: {width: '200px'}, columns: [ { diff --git a/components/empty/empty.svg b/components/empty/empty.svg index 46fa61e41..55e40af09 100644 --- a/components/empty/empty.svg +++ b/components/empty/empty.svg @@ -1,6 +1,5 @@ - - - + +