npm install vue3-draggable-resizable --save

		<Vue3DraggableResizable
          :initW="200"
          :initH="120"
          :scale="1"
          :x="x"
          :y="y"
          :w="w"
          :h="h"
          :active="active"
          :draggable="true"
          :resizable="true"
          @activated="print('activated')"
          @deactivated="print('deactivated')"
          @drag-start="print({x, y})"
          @dragging="print('dragging')"
          @drag-end="print({x, y})"
          @resize-start="print({x, y, w, h})"
          @resizing="print('resizing')"
          @resize-end="print({x, y, w, h})"
      >
          This is a draggable example
      </Vue3DraggableResizable>

import Vue3DraggableResizable from 'vue3-draggable-resizable'
import 'vue3-draggable-resizable/dist/Vue3DraggableResizable.css'

 	components: {
 		Vue3DraggableResizable
	},
	setup() {
    	// 拖拽缩放功能
	    const x = ref(20)
	    const y = ref(300);
	    const h = ref(100);
	    const w = ref(200);
	    const active = ref(false);
	
	    const print = (val) => {
	      console.log(val)
	    }
	
	    return {
	      x,
	      y,
	      h,
	      w,
	      active,
	      print
	    }
  },

/deep/ .vdr-container {
  box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
  &:hover {
    cursor: move;
  }
}
/deep/ .vdr-handle {
  display: block !important;
  width: 4px;
  height: 4px;
  border: 1px solid #ccc;
}
/deep/ .vdr-container.active {
  border-color: #fff;
  border-style: none;
}