Browse Source

fix: empty props #6230

pull/6236/head
tangjinzhou 2 years ago
parent
commit
81e26a900e
  1. 1
      components/empty/empty.tsx
  2. 2
      components/empty/index.en-US.md
  3. 24
      components/empty/index.tsx
  4. 2
      components/empty/index.zh-CN.md
  5. 1
      components/empty/simple.tsx

1
components/empty/empty.tsx

@ -4,6 +4,7 @@ import type { CSSProperties } from 'vue';
import { defineComponent, computed } from 'vue'; import { defineComponent, computed } from 'vue';
const Empty = defineComponent({ const Empty = defineComponent({
compatConfig: { MODE: 3 },
setup() { setup() {
const [, token] = useToken(); const [, token] = useToken();

2
components/empty/index.en-US.md

@ -2,7 +2,7 @@
category: Components category: Components
type: Data Display type: Data Display
title: Empty title: Empty
cover: https://gw.alipayobjects.com/zos/alicdn/MNbKfLBVb/Empty.svg cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*ZdiZSLzEV0wAAAAAAAAAAAAADrJ8AQ/original
--- ---
Empty state placeholder. Empty state placeholder.

24
components/empty/index.tsx

@ -1,12 +1,12 @@
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
import type { CSSProperties, PropType, ExtractPropTypes } from 'vue'; import type { CSSProperties, ExtractPropTypes } from 'vue';
import classNames from '../_util/classNames'; import classNames from '../_util/classNames';
import LocaleReceiver from '../locale-provider/LocaleReceiver'; import LocaleReceiver from '../locale-provider/LocaleReceiver';
import DefaultEmptyImg from './empty'; import DefaultEmptyImg from './empty';
import SimpleEmptyImg from './simple'; import SimpleEmptyImg from './simple';
import { filterEmpty } from '../_util/props-util'; import { filterEmpty } from '../_util/props-util';
import PropTypes from '../_util/vue-types'; import type { VueNode } from '../_util/type';
import { withInstall } from '../_util/type'; import { anyType, objectType, withInstall } from '../_util/type';
import useConfigInject from '../config-provider/hooks/useConfigInject'; import useConfigInject from '../config-provider/hooks/useConfigInject';
import useStyle from './style'; import useStyle from './style';
@ -20,17 +20,16 @@ interface Locale {
export const emptyProps = () => ({ export const emptyProps = () => ({
prefixCls: String, prefixCls: String,
class: PropTypes.any, imageStyle: objectType<CSSProperties>(),
style: [String, Object] as PropType<string | CSSProperties>, image: anyType<VueNode>(),
imageStyle: Object as PropType<CSSProperties>, description: anyType<VueNode>(),
image: PropTypes.any,
description: PropTypes.any,
}); });
export type EmptyProps = Partial<ExtractPropTypes<ReturnType<typeof emptyProps>>>; export type EmptyProps = Partial<ExtractPropTypes<ReturnType<typeof emptyProps>>>;
const Empty = defineComponent({ const Empty = defineComponent({
name: 'AEmpty', name: 'AEmpty',
compatConfig: { MODE: 3 },
inheritAttrs: false, inheritAttrs: false,
props: emptyProps(), props: emptyProps(),
setup(props, { slots = {}, attrs }) { setup(props, { slots = {}, attrs }) {
@ -41,7 +40,7 @@ const Empty = defineComponent({
return () => { return () => {
const prefixCls = prefixClsRef.value; const prefixCls = prefixClsRef.value;
const { const {
image = defaultEmptyImg, image = slots.image?.() || defaultEmptyImg,
description = slots.description?.() || undefined, description = slots.description?.() || undefined,
imageStyle, imageStyle,
class: className = '', class: className = '',
@ -88,12 +87,5 @@ const Empty = defineComponent({
Empty.PRESENTED_IMAGE_DEFAULT = defaultEmptyImg; Empty.PRESENTED_IMAGE_DEFAULT = defaultEmptyImg;
Empty.PRESENTED_IMAGE_SIMPLE = simpleEmptyImg; Empty.PRESENTED_IMAGE_SIMPLE = simpleEmptyImg;
Empty.inheritAttrs = false;
Empty.props = {
prefixCls: String,
image: PropTypes.any,
description: PropTypes.any,
imageStyle: { type: Object as PropType<CSSProperties>, default: undefined as CSSProperties },
};
export default withInstall(Empty); export default withInstall(Empty);

2
components/empty/index.zh-CN.md

@ -3,7 +3,7 @@ category: Components
type: 数据展示 type: 数据展示
title: Empty title: Empty
subtitle: 空状态 subtitle: 空状态
cover: https://gw.alipayobjects.com/zos/alicdn/MNbKfLBVb/Empty.svg cover: https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*ZdiZSLzEV0wAAAAAAAAAAAAADrJ8AQ/original
--- ---
空状态时的展示占位图。 空状态时的展示占位图。

1
components/empty/simple.tsx

@ -3,6 +3,7 @@ import { computed, defineComponent } from 'vue';
import { useToken } from '../theme/internal'; import { useToken } from '../theme/internal';
const Simple = defineComponent({ const Simple = defineComponent({
compatConfig: { MODE: 3 },
setup() { setup() {
const [, token] = useToken(); const [, token] = useToken();

Loading…
Cancel
Save