diff --git a/components/skeleton/Paragraph.tsx b/components/skeleton/Paragraph.tsx index 5bf25bfb6a..ed56e6c0a0 100644 --- a/components/skeleton/Paragraph.tsx +++ b/components/skeleton/Paragraph.tsx @@ -1,6 +1,5 @@ import * as React from 'react'; import classNames from 'classnames'; -import { polyfill } from 'react-lifecycles-compat'; type widthUnit = number | string; @@ -12,56 +11,28 @@ export interface SkeletonParagraphProps { rows?: number; } -interface SkeletonParagraphState { - prevProps: SkeletonParagraphProps; - widthList: Array; -} - -class Paragraph extends React.Component { +class Paragraph extends React.Component { static defaultProps: Partial = { prefixCls: 'ant-skeleton-paragraph', }; - static getDerivedStateFromProps( - props: SkeletonParagraphProps, - state: SkeletonParagraphState, - ): Partial { - const { prevProps } = state; - const { width, rows = 2 } = props; - - const newState: Partial = { - prevProps: props, - }; - - if (rows !== prevProps.rows || width !== prevProps.width) { - // Parse width list - let widthList = []; - if (width && Array.isArray(width)) { - widthList = width; - } else if (width && !Array.isArray(width)) { - widthList = []; - widthList[rows - 1] = width; - } - - newState.widthList = widthList; + getWidth(index: number) { + const { width, rows = 2 } = this.props; + if (Array.isArray(width)) { + return width[index]; } - - return newState; + // last paragraph + if (rows - 1 === index) { + return width; + } + return undefined; } - state: SkeletonParagraphState = { - prevProps: {}, - widthList: [], - }; - render() { - const { widthList } = this.state; const { prefixCls, className, style, rows } = this.props; - const rowList = [...Array(rows)].map((_, index) => ( -
  • +
  • )); - return (