Konvajs + vuejs如何保存更改的元素高度和宽度

<template>
  <div>
    <v-stage :config="stageConfig">
      <v-layer>
        <v-rect
          :config="{
            x: 50,
            y: 50,
            width: elementSize.width,
            height: elementSize.height,
            fill: 'red',
            draggable: true
          }"
          @transformend="saveElementSize"
        ></v-rect>
      </v-layer>
    </v-stage>
  </div>
</template>

<script>
import { Stage, Layer, Rect } from 'konva-vue';

export default {
  components: {
    VStage: Stage,
    VLayer: Layer,
    VRect: Rect
  },
  data() {
    return {
      stageConfig: {
        width: 500,
        height: 500
      },
      elementSize: {
        width: 100,
        height: 100
      }
    };
  },
  watch: {
    elementSize: {
      deep: true,
      handler() {
        // 在这里执行保存元素高度和宽度的操作，例如发送到后端服务器
        this.saveElementSize();
      }
    }
  },
  methods: {
    saveElementSize() {
      // 执行保存元素高度和宽度的操作，例如发送到后端服务器
      // 使用axios库发送异步请求
      axios.post('/save-element-size', this.elementSize)
        .then(response => {
          console.log('Element size saved successfully');
        })
        .catch(error => {
          console.error('Failed to save element size', error);
        });
    }
  }
};
</script>