index.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. import { VantComponent } from '../common/component';
  2. import { transition } from '../mixins/transition';
  3. VantComponent({
  4. classes: [
  5. 'enter-class',
  6. 'enter-active-class',
  7. 'enter-to-class',
  8. 'leave-class',
  9. 'leave-active-class',
  10. 'leave-to-class',
  11. 'close-icon-class',
  12. ],
  13. mixins: [transition(false)],
  14. props: {
  15. round: Boolean,
  16. closeable: Boolean,
  17. customStyle: String,
  18. overlayStyle: String,
  19. transition: {
  20. type: String,
  21. observer: 'observeClass',
  22. },
  23. zIndex: {
  24. type: Number,
  25. value: 100,
  26. },
  27. overlay: {
  28. type: Boolean,
  29. value: true,
  30. },
  31. closeIcon: {
  32. type: String,
  33. value: 'cross',
  34. },
  35. closeIconPosition: {
  36. type: String,
  37. value: 'top-right',
  38. },
  39. closeOnClickOverlay: {
  40. type: Boolean,
  41. value: true,
  42. },
  43. position: {
  44. type: String,
  45. value: 'center',
  46. observer: 'observeClass',
  47. },
  48. safeAreaInsetBottom: {
  49. type: Boolean,
  50. value: true,
  51. },
  52. safeAreaInsetTop: {
  53. type: Boolean,
  54. value: false,
  55. },
  56. safeAreaTabBar: {
  57. type: Boolean,
  58. value: false,
  59. },
  60. lockScroll: {
  61. type: Boolean,
  62. value: true,
  63. },
  64. },
  65. created() {
  66. this.observeClass();
  67. },
  68. methods: {
  69. onClickCloseIcon() {
  70. this.$emit('close');
  71. },
  72. onClickOverlay() {
  73. this.$emit('click-overlay');
  74. if (this.data.closeOnClickOverlay) {
  75. this.$emit('close');
  76. }
  77. },
  78. observeClass() {
  79. const { transition, position, duration } = this.data;
  80. const updateData = {
  81. name: transition || position,
  82. };
  83. if (transition === 'none') {
  84. updateData.duration = 0;
  85. this.originDuration = duration;
  86. }
  87. else if (this.originDuration != null) {
  88. updateData.duration = this.originDuration;
  89. }
  90. this.setData(updateData);
  91. },
  92. },
  93. });