index.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import baseComponent from '../helpers/baseComponent'
  2. import classNames from '../helpers/classNames'
  3. baseComponent({
  4. relations: {
  5. '../skeleton-avatar/index': {
  6. type: 'descendant',
  7. observer() {
  8. this.debounce(this.updated)
  9. },
  10. },
  11. '../skeleton-paragraph/index': {
  12. type: 'descendant',
  13. observer() {
  14. this.debounce(this.updated)
  15. },
  16. },
  17. },
  18. properties: {
  19. prefixCls: {
  20. type: String,
  21. value: 'wux-skeleton',
  22. },
  23. active: {
  24. type: Boolean,
  25. value: false,
  26. observer: 'updated',
  27. },
  28. },
  29. computed: {
  30. classes() {
  31. const { prefixCls, active } = this.data
  32. const wrap = classNames(prefixCls, {
  33. [`${prefixCls}--active`]: active,
  34. })
  35. return {
  36. wrap,
  37. }
  38. },
  39. },
  40. methods: {
  41. updated(active = this.data.active) {
  42. const avatar = this.getRelationNodes('../skeleton-avatar/index')
  43. const paragraph = this.getRelationNodes('../skeleton-paragraph/index')
  44. if (avatar.length > 0) {
  45. avatar.forEach((element) => {
  46. element.updated(active)
  47. })
  48. }
  49. if (paragraph.length > 0) {
  50. paragraph.forEach((element) => {
  51. element.updated(active)
  52. })
  53. }
  54. },
  55. },
  56. })