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';
const Empty = defineComponent({
compatConfig: { MODE: 3 },
setup() {
const [, token] = useToken();

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

@ -2,7 +2,7 @@
category: Components
type: Data Display
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.

24
components/empty/index.tsx

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

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

@ -3,7 +3,7 @@ category: Components
type: 数据展示
title: Empty
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';
const Simple = defineComponent({
compatConfig: { MODE: 3 },
setup() {
const [, token] = useToken();

Loading…
Cancel
Save