vant-weapp/packages/popup/index.ts

import { VantComponent } from '../common/component';
import { transition } from '../mixins/transition';
import { iphonex } from '../mixins/iphonex';

VantComponent({
  classes: [
    'enter-class',
    'enter-active-class',
    'enter-to-class',
    'leave-class',
    'leave-active-class',
    'leave-to-class'
  ],

  mixins: [transition(false), iphonex],

  props: {
    transition: {
      type: String,
      observer: 'observeClass'
    },
    customStyle: String,
    overlayStyle: String,
    zIndex: {
      type: Number,
      value: 100
    },
    overlay: {
      type: Boolean,
      value: true
    },
    closeOnClickOverlay: {
      type: Boolean,
      value: true
    },
    position: {
      type: String,
      value: 'center',
      observer: 'observeClass'
    }
  },

  created() {
    this.observeClass();
  },

  methods: {
    onClickOverlay() {
      this.$emit('click-overlay');

      if (this.data.closeOnClickOverlay) {
        this.$emit('close');
      }
    },

    onTransitionEnd() {
      !this.data.show && this.$emit('transitionEnd');
    },

    observeClass() {
      const { transition, position } = this.data;
      this.updateClasses(transition || position);
    }
  }
});