index.js 1.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { VantComponent } from '../common/component';
  2. import { useParent } from '../common/relation';
  3. import { setContentAnimate } from './animate';
  4. VantComponent({
  5. classes: ['title-class', 'content-class'],
  6. relation: useParent('collapse'),
  7. props: {
  8. name: null,
  9. title: null,
  10. value: null,
  11. icon: String,
  12. label: String,
  13. disabled: Boolean,
  14. clickable: Boolean,
  15. border: {
  16. type: Boolean,
  17. value: true,
  18. },
  19. isLink: {
  20. type: Boolean,
  21. value: true,
  22. },
  23. },
  24. data: {
  25. expanded: false,
  26. },
  27. mounted() {
  28. this.updateExpanded();
  29. this.mounted = true;
  30. },
  31. methods: {
  32. updateExpanded() {
  33. if (!this.parent) {
  34. return;
  35. }
  36. const { value, accordion } = this.parent.data;
  37. const { children = [] } = this.parent;
  38. const { name } = this.data;
  39. const index = children.indexOf(this);
  40. const currentName = name == null ? index : name;
  41. const expanded = accordion
  42. ? value === currentName
  43. : (value || []).some((name) => name === currentName);
  44. if (expanded !== this.data.expanded) {
  45. setContentAnimate(this, expanded, this.mounted);
  46. }
  47. this.setData({ index, expanded });
  48. },
  49. onClick() {
  50. if (this.data.disabled) {
  51. return;
  52. }
  53. const { name, expanded } = this.data;
  54. const index = this.parent.children.indexOf(this);
  55. const currentName = name == null ? index : name;
  56. this.parent.switch(currentName, !expanded);
  57. },
  58. },
  59. });