Paragraph.js 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
  2. import PropTypes from '../_util/vue-types';
  3. var widthUnit = PropTypes.oneOfType([PropTypes.number, PropTypes.string]);
  4. var skeletonParagraphProps = {
  5. prefixCls: PropTypes.string,
  6. width: PropTypes.oneOfType([widthUnit, PropTypes.arrayOf(widthUnit)]),
  7. rows: PropTypes.number
  8. };
  9. export var SkeletonParagraphProps = PropTypes.shape(skeletonParagraphProps);
  10. var Paragraph = {
  11. props: skeletonParagraphProps,
  12. methods: {
  13. getWidth: function getWidth(index) {
  14. var width = this.width,
  15. _rows = this.rows,
  16. rows = _rows === undefined ? 2 : _rows;
  17. if (Array.isArray(width)) {
  18. return width[index];
  19. }
  20. // last paragraph
  21. if (rows - 1 === index) {
  22. return width;
  23. }
  24. return undefined;
  25. }
  26. },
  27. render: function render() {
  28. var _this = this;
  29. var h = arguments[0];
  30. var _$props = this.$props,
  31. prefixCls = _$props.prefixCls,
  32. rows = _$props.rows;
  33. var rowList = [].concat(_toConsumableArray(Array(rows))).map(function (_, index) {
  34. var width = _this.getWidth(index);
  35. return h('li', { key: index, style: { width: typeof width === 'number' ? width + 'px' : width } });
  36. });
  37. return h(
  38. 'ul',
  39. { 'class': prefixCls },
  40. [rowList]
  41. );
  42. }
  43. };
  44. export default Paragraph;