feat: update select

components/select/__tests__/index.test.js

@@ -33,7 +33,7 @@ describe('Select', () => {
           .findAll({ name: 'MenuItem' })
           .at(0)
           .text(),
-      ).toBe('Not Found');
+      ).toBe('No Data');
     });
   });
 

components/select/index.jsx

@@ -2,8 +2,7 @@ import warning from 'warning';
 import omit from 'omit.js';
 import PropTypes from '../_util/vue-types';
 import { Select as VcSelect, Option, OptGroup } from '../vc-select';
-import LocaleReceiver from '../locale-provider/LocaleReceiver';
+import { ConfigConsumerProps } from '../config-provider';
-import defaultLocale from '../locale-provider/default';
 import {
   getComponentFromProp,
   getOptionProps,
@@ -96,7 +95,7 @@ const Select = {
   name: 'ASelect',
   props: {
     ...SelectProps,
-    prefixCls: PropTypes.string.def('ant-select'),
+    prefixCls: PropTypes.string,
     showSearch: PropTypes.bool.def(false),
     transitionName: PropTypes.string.def('slide-up'),
     choiceTransitionName: PropTypes.string.def('zoom'),
@@ -124,21 +123,24 @@ const Select = {
     blur() {
       this.$refs.vcSelect.blur();
     },
-    getNotFoundContent(locale) {
+    getNotFoundContent(renderEmpty) {
+      const h = this.$createElement;
       const notFoundContent = getComponentFromProp(this, 'notFoundContent');
-      if (this.isCombobox()) {
+      if (notFoundContent !== undefined) {
-        // AutoComplete don't have notFoundContent defaultly
+        return notFoundContent;
-        return notFoundContent === undefined ? null : notFoundContent;
       }
-      return notFoundContent === undefined ? locale.notFoundContent : notFoundContent;
+      if (this.isCombobox()) {
+        return null;
+      }
+      return renderEmpty(h, 'Select');
     },
     isCombobox() {
       const { mode } = this;
       return mode === 'combobox' || mode === SECRET_COMBOBOX_MODE_DO_NOT_USE;
     },
 
-    renderSuffixIcon() {
+    renderSuffixIcon(prefixCls) {
-      const { prefixCls, loading } = this.$props;
+      const { loading } = this.$props;
       let suffixIcon = getComponentFromProp(this, 'suffixIcon');
       suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon;
       if (suffixIcon) {
@@ -151,11 +153,24 @@ const Select = {
       }
       return <Icon type="down" class={`${prefixCls}-arrow-icon`} />;
     },
+  },
+  render() {
+    const {
+      prefixCls: customizePrefixCls,
+      size,
+      mode,
+      options,
+      getPopupContainer,
+      ...restProps
+    } = getOptionProps(this);
+
+    const getPrefixCls = this.configProvider.getPrefixCls || ConfigConsumerProps.getPrefixCls;
+    const renderEmpty = (
+      this.configProvider.renderEmpty &&
+      this.configProvider.renderEmpty()
+    ) || ConfigConsumerProps.renderEmpty;
+    const prefixCls = getPrefixCls('select', customizePrefixCls);
 
-    renderSelect(locale) {
-      const { prefixCls, size, mode, options, getPopupContainer, ...restProps } = getOptionProps(
-        this,
-      );
     const { getPopupContainer: getContextPopupContainer } = this.configProvider;
     let removeIcon = getComponentFromProp(this, 'removeIcon');
     removeIcon = Array.isArray(removeIcon) ? removeIcon[0] : removeIcon;
@@ -208,7 +223,7 @@ const Select = {
 
     const selectProps = {
       props: {
-          inputIcon: this.renderSuffixIcon(),
+        inputIcon: this.renderSuffixIcon(prefixCls),
         removeIcon: finalRemoveIcon,
         clearIcon: finalClearIcon,
         menuItemSelectedIcon: finalMenuItemSelectedIcon,
@@ -216,7 +231,7 @@ const Select = {
         ...modeConfig,
         prefixCls,
         optionLabelProp: optionLabelProp || 'children',
-          notFoundContent: this.getNotFoundContent(locale),
+        notFoundContent: this.getNotFoundContent(renderEmpty),
         maxTagPlaceholder: getComponentFromProp(this, 'maxTagPlaceholder'),
         placeholder: getComponentFromProp(this, 'placeholder'),
         children: options
@@ -239,16 +254,6 @@ const Select = {
     };
     return <VcSelect {...selectProps} />;
   },
-  },
-  render() {
-    return (
-      <LocaleReceiver
-        componentName="Select"
-        defaultLocale={defaultLocale.Select}
-        scopedSlots={{ default: this.renderSelect }}
-      />
-    );
-  },
 };
 
 /* istanbul ignore next */