index.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. import { useParent } from '../common/relation';
  2. import { VantComponent } from '../common/component';
  3. VantComponent({
  4. classes: ['item-title-class'],
  5. field: true,
  6. relation: useParent('dropdown-menu', function () {
  7. this.updateDataFromParent();
  8. }),
  9. props: {
  10. value: {
  11. type: null,
  12. observer: 'rerender',
  13. },
  14. title: {
  15. type: String,
  16. observer: 'rerender',
  17. },
  18. disabled: Boolean,
  19. titleClass: {
  20. type: String,
  21. observer: 'rerender',
  22. },
  23. options: {
  24. type: Array,
  25. value: [],
  26. observer: 'rerender',
  27. },
  28. popupStyle: String,
  29. useBeforeToggle: {
  30. type: Boolean,
  31. value: false,
  32. },
  33. },
  34. data: {
  35. transition: true,
  36. showPopup: false,
  37. showWrapper: false,
  38. displayTitle: '',
  39. },
  40. methods: {
  41. rerender() {
  42. wx.nextTick(() => {
  43. var _a;
  44. (_a = this.parent) === null || _a === void 0 ? void 0 : _a.updateItemListData();
  45. });
  46. },
  47. updateDataFromParent() {
  48. if (this.parent) {
  49. const { overlay, duration, activeColor, closeOnClickOverlay, direction, } = this.parent.data;
  50. this.setData({
  51. overlay,
  52. duration,
  53. activeColor,
  54. closeOnClickOverlay,
  55. direction,
  56. });
  57. }
  58. },
  59. onOpen() {
  60. this.$emit('open');
  61. },
  62. onOpened() {
  63. this.$emit('opened');
  64. },
  65. onClose() {
  66. this.$emit('close');
  67. },
  68. onClosed() {
  69. this.$emit('closed');
  70. this.setData({ showWrapper: false });
  71. },
  72. onOptionTap(event) {
  73. const { option } = event.currentTarget.dataset;
  74. const { value } = option;
  75. const shouldEmitChange = this.data.value !== value;
  76. this.setData({ showPopup: false, value });
  77. this.$emit('close');
  78. this.rerender();
  79. if (shouldEmitChange) {
  80. this.$emit('change', value);
  81. }
  82. },
  83. toggle(show, options = {}) {
  84. const { showPopup } = this.data;
  85. if (typeof show !== 'boolean') {
  86. show = !showPopup;
  87. }
  88. if (show === showPopup) {
  89. return;
  90. }
  91. this.onBeforeToggle(show).then((status) => {
  92. var _a;
  93. if (!status) {
  94. return;
  95. }
  96. this.setData({
  97. transition: !options.immediate,
  98. showPopup: show,
  99. });
  100. if (show) {
  101. (_a = this.parent) === null || _a === void 0 ? void 0 : _a.getChildWrapperStyle().then((wrapperStyle) => {
  102. this.setData({ wrapperStyle, showWrapper: true });
  103. this.rerender();
  104. });
  105. }
  106. else {
  107. this.rerender();
  108. }
  109. });
  110. },
  111. onBeforeToggle(status) {
  112. const { useBeforeToggle } = this.data;
  113. if (!useBeforeToggle) {
  114. return Promise.resolve(true);
  115. }
  116. return new Promise((resolve) => {
  117. this.$emit('before-toggle', {
  118. status,
  119. callback: (value) => resolve(value),
  120. });
  121. });
  122. },
  123. },
  124. });