| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051 |
- import { createVNode as _createVNode } from "vue";
- import { defineComponent } from 'vue';
- export const skeletonParagraphProps = () => ({
- prefixCls: String,
- width: {
- type: [Number, String, Array]
- },
- rows: Number
- });
- const SkeletonParagraph = defineComponent({
- compatConfig: {
- MODE: 3
- },
- name: 'SkeletonParagraph',
- props: skeletonParagraphProps(),
- setup(props) {
- const getWidth = index => {
- const {
- width,
- rows = 2
- } = props;
- if (Array.isArray(width)) {
- return width[index];
- }
- // last paragraph
- if (rows - 1 === index) {
- return width;
- }
- return undefined;
- };
- return () => {
- const {
- prefixCls,
- rows
- } = props;
- const rowList = [...Array(rows)].map((_, index) => {
- const width = getWidth(index);
- return _createVNode("li", {
- "key": index,
- "style": {
- width: typeof width === 'number' ? `${width}px` : width
- }
- }, null);
- });
- return _createVNode("ul", {
- "class": prefixCls
- }, [rowList]);
- };
- }
- });
- export default SkeletonParagraph;
|