index.js 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  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. size: String,
  9. name: null,
  10. title: null,
  11. value: null,
  12. icon: String,
  13. label: String,
  14. disabled: Boolean,
  15. clickable: Boolean,
  16. border: {
  17. type: Boolean,
  18. value: true,
  19. },
  20. isLink: {
  21. type: Boolean,
  22. value: true,
  23. },
  24. },
  25. data: {
  26. expanded: false,
  27. parentBorder: true,
  28. },
  29. mounted() {
  30. this.updateExpanded();
  31. this.mounted = true;
  32. },
  33. methods: {
  34. updateExpanded() {
  35. if (!this.parent) {
  36. return;
  37. }
  38. const { value, accordion, border } = this.parent.data;
  39. const { children = [] } = this.parent;
  40. const { name } = this.data;
  41. const index = children.indexOf(this);
  42. const currentName = name == null ? index : name;
  43. const expanded = accordion
  44. ? value === currentName
  45. : (value || []).some((name) => name === currentName);
  46. if (expanded !== this.data.expanded) {
  47. setContentAnimate(this, expanded, this.mounted);
  48. }
  49. this.setData({ index, expanded, parentBorder: border });
  50. },
  51. onClick() {
  52. if (this.data.disabled) {
  53. return;
  54. }
  55. const { name, expanded } = this.data;
  56. const index = this.parent.children.indexOf(this);
  57. const currentName = name == null ? index : name;
  58. this.parent.switch(currentName, !expanded);
  59. },
  60. },
  61. });