<!--
 * @Author: Jason Liu
 * @Date: 2022-03-31 13:43:22
 * @Desc: 
-->
<template>
  <div id="modal_container" ref="modalContainer">

    <a-button @click="toTest()">弹框拖拽缩放</a-button>

    <a-modal
      v-model="show"
      v-modalDrag
      :key="keyVal"
      :mask="false"
      :maskClosable="false"
      :footer="null"
      :getContainer="() => { return $refs.modalContainer }"
      title="测试弹框"
      destroyOnClose
      @ok="show = false"
      @cancel="show = false"
    >
      <div>我是弹框内容</div>
    </a-modal>


  </div>
</template>
<script>
  const modalDrag = require('@/utils/modalDrag').default;
  export default {
    directives: {
      modalDrag
    },
    components: {},
    data() {
      return {
        show: false,
        keyVal: 1,
      };
    },
    created() {},
    methods: {
      toTest() {
        this.keyVal++;
        this.show = true;
      },
    },
  };
</script>
<style lang="less" scoped>
</style>
