index.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <template>
  2. <uni-shadow-root class="vant-collapse-index"><view :class="'custom-class van-collapse '+(border ? 'van-hairline--top-bottom' : '')">
  3. <slot></slot>
  4. </view></uni-shadow-root>
  5. </template>
  6. <script>
  7. global['__wxRoute'] = 'vant/collapse/index'
  8. import { VantComponent } from '../common/component';
  9. VantComponent({
  10. relation: {
  11. name: 'collapse-item',
  12. type: 'descendant',
  13. linked(child) {
  14. this.children.push(child);
  15. },
  16. unlinked(child) {
  17. this.children = this.children.filter((item) => item !== child);
  18. }
  19. },
  20. props: {
  21. value: {
  22. type: null,
  23. observer: 'updateExpanded'
  24. },
  25. accordion: {
  26. type: Boolean,
  27. observer: 'updateExpanded'
  28. },
  29. border: {
  30. type: Boolean,
  31. value: true
  32. }
  33. },
  34. beforeCreate() {
  35. this.children = [];
  36. },
  37. methods: {
  38. updateExpanded() {
  39. this.children.forEach((child) => {
  40. child.updateExpanded();
  41. });
  42. },
  43. switch(name, expanded) {
  44. const { accordion, value } = this.data;
  45. if (!accordion) {
  46. name = expanded
  47. ? (value || []).concat(name)
  48. : (value || []).filter((activeName) => activeName !== name);
  49. }
  50. else {
  51. name = expanded ? name : '';
  52. }
  53. this.$emit('change', name);
  54. this.$emit('input', name);
  55. }
  56. }
  57. });
  58. export default global['__wxComponents']['vant/collapse/index']
  59. </script>
  60. <style platform="mp-weixin">
  61. @import '../common/index.css';
  62. </style>